Question

I have multiple datepickers in one page.
I user class name to set the option for things like appears.

$('.datepickers').datepicker({
        dateFormat: "yy-mm-dd",
        showButtonPanel: true,
        changeMonth: true,
        changeYear: true,
        showOtherMonths: true,
        selectOtherMonths: true,
        showWeek: true
});

Then, I want to set onSelect event for two of them.

$('#to').datepicker({
    onSelect: function(selectedDate) {
        $('#from').datepicker("option", "minDate", selectedDate);
    }
});

Similar onSelect event setting for others.

However, this would not work. Any suggestion for how to fix this, besides setting all options individually by id?

Answer 1

did you try the following syntax? You don’t want to _init the datepicker widget again. You just want to change an option. This is the way to do that with jquery ui widgets.

    $('#to').datepicker('option', 'onSelect', function(selectedDate) {
            $('#from').datepicker("option", "minDate", selectedDate);
        });