Question

I have a jquery ui datepicker range with a from-date and to-date, how do I send an alert when the date range is changed? here’s my code:

$(function() {
var dates = $("#date-from, #date-to").datepicker({
    defaultDate: "+1w",
    changeMonth: true,
    numberOfMonths: 2,
    onSelect: function(selectedDate) {
        instance = $(this).data("datepicker"), date = $.datepicker.parseDate(
        instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings);
        dates.datepicker("option", "dateFormat", "DD, d MM, yy");
    }

});
$('#date-from').datepicker({
    onClose: function() {
        alert("closed");
    }
 });
});

but the onClose: event is not fired. Thanks

Answer 1

You can either separately initialise #date-from and #date-to, or include the onClose option in the combined initiation and check for the element ID. Here is an example for the 2nd approach:

var dates = $("#date-from, #date-to").datepicker({
    ...
    onClose: function() {
        if ($(this).attr('id') == 'date-from') {
            alert("closed");
        }
    }
});

See this in action: http://jsfiddle.net/william/L9Szd/1/