Search code examples
javascriptruby-on-railsdatetimepickerbootstrap-datetimepicker

How to call "onSelect" function for bootstrap3-datetimepicker? jQuery


I am using Rails 4 and I have the gem bootstrap3-datetimepicker-railsinstalled.

It is working fine, but I want to be able to do an onSelect call like I can with the normal bootstrap-datepicker.

I want to be able to do something like this:

$("#start").datetimepicker({
    minDate: new Date()
}).on("change", function(selectedDate) {
    $("#end").datetimepicker({ minDate: selectedDate });
});

$("#end").datetimepicker();

but the documentation is very vague and doesn't seem to include anything on this concept. I am still pretty surprised that this feature of validating start and end dates is not a native option in any date or time picker.

How would I realize this?

Note: I am using bootstrap3-datetimepicker, not the regular bootstrap-datepicker and not jquery-datetimepicker.

Side Note: I've always felt that the world's most ideal automatic datepicker validation would look something like this:

$("#start").datepicker({
    minDate: new Date(),
    endDate: "#end"  // Would automatically call $("#end").datepicker and set the minDate to whatever #start's selected date is
});

I am considering creating my own branch to try and implement it because I feel that the concept of start and end dates is commonly ignored when datepickers are created but is so frequently needed.


Solution

  • Take a look at the documentation section on linked pickers: https://eonasdan.github.io/bootstrap-datetimepicker/#linked-pickers

    In your case you would do:

    $("#start").on("dp.change", function (e) {
        $('#end').data("DateTimePicker").minDate(e.date);
    });