CODEWITHSUNDEEP
jquerytwitter-bootstrap-3datepicker
TCFDS
TCFDS

Reputation: 622

Set month which opens from Bootstrap 3 Datepicker

I'm using Bootstrap 3 Datepicker: http://eonasdan.github.io/bootstrap-datetimepicker/

I have set minDate to the future, but when I open datepicker, it shows current month even though I'm not able to select any date from that month. I would like that datepicker would open the first possible month if current month is not available. How could I do this?

My initaliation code:

$("#mySelector").datetimepicker({
    minDate: new Date(2015,3,12),
    maxDate: new Date(2015,3,15),
    pickTime: false,
    useCurrent: false,
    useStrict: true
});

Upvotes: 1

Views: 3601

Answers (2)

Shaun
Shaun

Reputation: 549

I too have been facing the same problem and do not wish to set a default date (users must select a date).

Here's how I got around it:

  $('#mySelector').on('dp.show', function(e) {
    datePicker = $('#mySelector').data("DateTimePicker");
    if (datePicker.date() == null || datePicker.date().isBefore(datePicker.minDate())) {
      datePicker.date(datePicker.minDate());
      datePicker.date(null);
    }
  });

If the date selection is empty, or below the min date (if it can be changed), then we first set the current date to be the min date (which forces the picker to the right month, and then clear the selection again)

I tried simply calling this right after initialisation, but it didn't work, so I changed to it be bound to the 'dp.show' event.

If your minDate can be changed while the picker is loaded, I suggest calling it right after changing the date as well, to immediately clear an invalid date selection and move to the right month (I'm using it in linked pickers)

Upvotes: 1

BENARD Patrick
BENARD Patrick

Reputation: 30975

Use defaultDate options : 

$("#mySelector").datetimepicker({
    defaultDate: new Date(2015,3,12),     // <---- Look here
    minDate: new Date(2015,3,12),
    maxDate: new Date(2015,3,15),
    pickTime: false,
    useCurrent: false,
    useStrict: true
});

If input field needs to be clear, date may be set null (syntax of old version):

$("#mySelector").data("DateTimePicker").setDate(null);

After this datepicker opens month of defaultDate instead of current date.

Upvotes: 1

Related Questions