Question

I have this code and it’s working fine. The mindate and maxdate are defined dynamically where the selected date from the dropdown will be the maxdate and the mindate will be 14 days before the maxdate. But when I go back to the dropdown and re-select a second time, the mindate and maxdate is locked from the first selection from the dropdown.

<select id="dropdown" name="dropdown">
    <option value="12/08/2012">
    <option value="12/22/2012">
    <option value="01/05/2013">
</select>

<input type="text" id="start_date" name="xdate">

<script>
    $(function () {
        $('select[name="dropdown"]').change(function () {
            var bits = $(this).val().split('/');
            var end = new Date(bits[2], bits[0] - 1, bits[1]);
            var start = new Date(end.getTime());
            start.setDate(start.getDate() - 13);
            $('#start_date').multiDatesPicker({minDate:start, maxDate:end});
        });
    });
</script>

How can the mindate and maxdate change dynamically after selecting another range the second time? Am I missing something? Thanks! 🙂

Answer 1

To change the settings for a datepicker that has already been initialized, use:

$('#start_date').multiDatesPicker('option', {minDate:start, maxDate:end});