Change option dynamically in JQuery UI DatePicker fails

Question

I want to make date range selection using jquery-ui datepicker. First change at #dteStart succeed to set minDate at #dteEnd. But #dteEnd failed to refresh its options on ne

Answer 1

The following jQuery helper function may be useful in such cases to preserve the original options:

$.fn.customizeDatepicker = function(newOptions) {
    var prevOptions = $(this).datepicker('option', 'all');
    $(this).datepicker('destroy').datepicker($.extend(prevOptions, newOptions));
    return this;
};

It saves the previous options and extends them with the new options.

Answer 2

put $("#dteEnd").datepicker("destroy"); before $("#dteEnd").datepicker(DateOptions); and it will work fine.

Answer 3

If you just want to change the already configured options, you can also do:

$("#dteEnd").datepicker("option", DateOptions);

or

$("#dteEnd").datepicker("option", { dateFormat: "mm/dd/yyyy" });