jQueryUI datepicker formatted date range clearing its partner on new date

Question

I have two input fields, displaying a from and a to month/year. No date should be selected, only the month and year are actually relevant, so first day in the month is used.

They also have an alt field each, to send a proper value to the server.

However, whenever a date has been selected in one field, and the min or maxDate gets set on the other, that one will clear its field. I have done some extensive debugging of the values passed, and have only been able to narrow it down to the formatting of the date being the issue. I can't seem to think of why it would be, however, with the extra code used, to parse and create a proper date.

Jsfiddle

Line 13, and 40 triggers the error:

$('#user_range2').datepicker('option', 'minDate', $('#user_range1').datepicker('getDate'));

I experimented with several jQuery versions on jsfiddle, and none appeared to have a fix.

Does anyone know how I can keep the formatting, and get it to work as intended?

Update

I've narrowed it down to the issue. Since there's no date in the format, the following line will throw an exception (from jqueryui.js@parseDate()):

date = this._daylightSavingAdjust(new Date(year, month - 1, day));
    if (date.getFullYear() !== year || date.getMonth() + 1 !== month || date.getDate() !== day) {
        throw "Invalid date"; // E.g. 31/02/00
    }

Unless there's a way to circumvent that, it seems to be impossible to not have a date in the format, when wanting to limit the range of two fields.

Answer 1

This works fine for me:

From date:

$( "#datepicker_start" ).datepicker({
        onClose: function( selectedDate ) {
            $( "#datepicker_end" ).datepicker( "option", "maxDate", selectedDate );
        }
});

To date:

$( "#datepicker_end" ).datepicker({
        onClose: function( selectedDate ) {
            $( "#datepicker_start" ).datepicker( "option", "maxDate", selectedDate );
        }
});