Search code examples
jquery-uidatepickerjquery-ui-datepicker

jQuery UI datepicker 'previous month' doesn't work

I implemented the jQuery UI datepicker in my site and noticed I couldn't click 'back' to the previous month.

My HTML:

<input type='text' id='date'>

the init script:

$( '#date' ).datepicker( {
    numberOfMonths: 4,
    showCurrentAtPos: 1,
    showButtonPanel: true
} );

I created a jsFiddle with jquery-ui-1.12.1 loading which replicated above problem. I solved it for now my switching to jquery-ui-1.9, but I'd like to be able to use the latest version. Is there anything that can be done to fix this problem?

I did some extensive debugging, the 'prev' button event is being launched, it just doesn't appear to call the update function with the right data, causing the datepicker to be updated with the same month first as it's showing before the click.

I'm starting to think this is a bug, if I set showCurrentAtPos to 0 instead of 1 the datepicker does work as expected (jsFiddle)

Solution

  • Was able to replicate the issue using jQuery 1.12.4 & UI 1.12.1, matching Demo versions: http://jqueryui.com/datepicker/. Working test: https://jsfiddle.net/Twisty/wkpvbp5u/

    If I comment out showCurrentAtPos, it works as expected.

    JavaScript

    $(function() {
  $('#date').datepicker({
    numberOfMonths: 4,
    //showCurrentAtPos: 1,
    showButtonPanel: true
  });
});

    So the issue may be in behavior of this option. I broke it more by setting the value to -1 as a test too. The Next button fails.

    Found: https://bugs.jqueryui.com/ticket/15129 so looks like you can use jQuery UI 1.11.4 but not 1.12.1. Might be a fix: https://github.com/jquery/jquery-ui/commit/17404ced478a235651513fa7bef3473ef1b039e8

    Hope that helps.