Opened 9 years ago

Closed 8 years ago

Last modified 4 years ago

#3307 closed bug (fixed)

ui.datepicker range selection causing previous month image to be replaced by text

Reported by: anonymous Owned by: grabanski
Priority: minor Milestone:
Component: ui.datepicker Version: 1.5.2
Keywords: Range Cc:
Blocked by: Blocking:


I am using IE 7.0.5730.13C0 and whenever I try to select a range I can see how the previous image used to go to the previous month is replaced by text after selecting the start date.

Change History (4)

comment:1 Changed 8 years ago by kbwood

Can you attach some sample code that illustrates the problem?

comment:2 Changed 8 years ago by GlowingRose

When previous months are not selectable (in this instance, when selecting a range after the first date, only later months can be selected), the previous "button" is replaced with a form label.

Line 1390, expanded for readability...

var prev = '<div class="ui-datepicker-prev">' + 
  (this._canAdjustMonth(inst, -1, drawYear, drawMonth) 
  ? (showBigPrevNext 
    ? '<a onclick="jQuery.datepicker._adjustDate(\'#' + + 
      '\', -' + stepBigMonths + ', \'M\');"' + this._addStatus(
      showStatus,, this._get(inst, 'prevBigStatus'), 
      initStatus) + '>' + prevBigText + '</a>' 
    : ''
    +  '<a onclick="jQuery.datepicker._adjustDate(\'#' + + 
      '\', -' + stepMonths + ', \'M\');"' +  this._addStatus(
      showStatus,, this._get(inst, 'prevStatus'), 
      initStatus) + '>' + prevText + '</a>' 
  :  (hideIfNoPrevNext 
    ? '' 
    : (showBigPrevNext 
      ? '<label>' + prevBigText + '</label>' 
      : ''
      + '<label>' + prevText + '</label>'
  + '</div>';

This is mildly annoying as prevText is displayed instead of the nice looking previous arrow graphic. To work around this, set hideIfNoPrevNext to true to hide the label in this case.

A better solution would be to show a disabled version of the previous arrow graphic. Something like '<a href="#" class="ui-datepicker-prev-disabled">' + prevText + '</a>' and have ui-datepicker-prev-disabled lower the opacity to 50%.

comment:3 Changed 8 years ago by kbwood

  • Resolution set to fixed
  • Status changed from new to closed

Refactored datepicker CSS to restore full functionality and fix errors.

comment:4 Changed 4 years ago by scottgonzalez

  • Milestone TBD deleted

Milestone TBD deleted

Please use jsFiddle or jsbin to provide test cases instead of pasting large blocks of code in the ticket.

If you have a fix, fork the repository on GitHub and send a pull request. Make sure to check out the guide for writing code for jQuery projects.

Modify Ticket

Change Properties

E-mail address and user name can be saved in the Preferences.

Note: See TracTickets for help on using tickets.