Multiple date picker - months jumping problems

Question

Iam using a jquery multiple datepicker calendar. When i go to month of april and clicks the date, the datepicker restores to march.

var lastMDPupdate = '2012-03-28';

$(function() {
  // Version //
  //$('title').append(' v' + latestMDPver);
  $('.mdp-version').text('v' + latestMDPver);
  $('#mdp-title').attr('title', 'last update: ' + lastMDPupdate);

  // Documentation //
  $('i:contains(type)').attr('title', '[Optional] accepted values are: "allowed" [default]; "disabled".');
  $('i:contains(format)').attr('title', '[Optional] accepted values are: "string" [default]; "object".');
  $('#how-to h4').each(function () {
  var a = $(this).closest('li').attr('id');
  $(this).wrap('<'+'a href="#'+a+'"></'+'a>');
});

$('#demos .demo').each(function () {
  var id = $(this).find('.box').attr('id') + '-demo';
  $(this).attr('id', id)
  .find('h3').wrapInner('<'+'a href="#'+id+'"></'+'a>');
});

// Run Demos
$('.demo .code').each(function() {
  eval($(this).attr('title','NEW: edit this code and test it!').text());
  this.contentEditable = true;
}).focus(function() {
  if(!$(this).next().hasClass('test'))
  $(this)
   .after('<button class="test">test</button>')
   .next('.test').click(function() {
  $(this).closest('.demo').find('.box').removeClass('hasDatepicker').empty();
  eval($(this).prev().text());
  $(this).remove();
});

Js fiddle link added. http://jsfiddle.net/bJ7zj/#update

Thanks in advance

Answer 1

The issue seems to be jQuery UI defaulting to today's date when it can't parse several dates. If you wont use , in your dates or plan on updated jQuery UI very soon, you can use the following fixhack which adds dates = dates.split(',').pop(), allowing the parser to parse the last date in the list when showing the control. You can put this code any place after the jQuery UI reference

$.datepicker._setDateFromField= function (inst, noDefault)
{
    if (inst.input.val() == inst.lastVal)
    {
        return;
    }
    var dateFormat = this._get(inst, 'dateFormat');
    var dates = inst.lastVal = inst.input ? inst.input.val() : null;
    dates = dates.split(',').pop()
    var date, defaultDate;
    date = defaultDate = this._getDefaultDate(inst);
    var settings = this._getFormatConfig(inst);
    try
    {
        date = this.parseDate(dateFormat, dates, settings) || defaultDate;
    } catch (event)
    {
        this.log(event);
        dates = (noDefault ? '' : dates);
    }
    inst.selectedDay = date.getDate();
    inst.drawMonth = inst.selectedMonth = date.getMonth();
    inst.drawYear = inst.selectedYear = date.getFullYear();
    inst.currentDay = (dates ? date.getDate() : 0);
    inst.currentMonth = (dates ? date.getMonth() : 0);
    inst.currentYear = (dates ? date.getFullYear() : 0);
    this._adjustInstDate(inst);
};