Bootstrap Date Range Picker -> Single Date Picker: How to set a Date

Question

I'm experimenting with Boootstrap Date Range Picker

Whats the best way to set Date into a Single Date Picker via Javascript?

Single Date Picker initialization code

$(#date).daterangepicker({
    locale: {
          format: 'DD/MM/YYYY',
    },
    singleDatePicker: true,
    showDropdowns: true
});

I tried with below code:

$("date").data('daterangepicker').setStartDate(data.startDate);

This way, I'm getting below output, which is not really acceptable!!!

Hope someone come up with a nice solution.

Cheers!!

Answer 1

Try

$("date").data('daterangepicker').setStartDate(data.startDate);
$("date").data('daterangepicker').setEndDate(data.startDate);

That is the only way I can find so far.

Answer 2

Try this:

Set Date:

$(#date).daterangepicker({
    locale: {
          format: 'DD/MM/YYYY',
    },
    singleDatePicker: true,
    showDropdowns: true,
    startDate: '2020/03/04',
    startDate: '2020/03/04'
});

Reset date:

$("#date").data('daterangepicker').setStartDate('2020/03/04'); 
$("#date").data('daterangepicker').setEndDate('2020/03/04');

If u gonna reset current date:

$("#date").data('daterangepicker').setStartDate(moment()); 
$("#date").data('daterangepicker').setEndDate(moment());

Answer 3

I had the same issue, in my case. The issue was in the startDate format, it was not matching with the format given in locale:{format:'DD/MM/YYYY'}