datepicker - reverse year range order

datepicker - reverse year range order

Hello,

I needed to reverse year range order when changeYear option was true. I've implemented an easy solution.  In jquery.ui.datepicker.js's _generateMonthYearHeader method, just change:

  1.             for (; year <= endYear; year++) {
  2.                 html += '<option value="' + year + '"' +
  3.                     (year == drawYear ? ' selected="selected"' : '') +
  4.                     '>' + year + '</option>';
  5.             }

for

  1.             var reverseYearRange = this._get(inst, 'reverseYearRange');
  2.             if(reverseYearRange){
  3.                 for (; year <= endYear; endYear--) {
  4.                     html += '<option value="' + endYear + '"' +
  5.                         (endYear == drawYear ? ' selected="selected"' : '') +
  6.                         '>' + endYear + '</option>';
  7.                 }
  8.             }else{
  9.                 for (; year <= endYear; year++) {
  10.                     html += '<option value="' + year + '"' +
  11.                         (year == drawYear ? ' selected="selected"' : '') +
  12.                         '>' + year + '</option>';
  13.                 }
  14.             }

Also, you must add default option at line 80:

  1.         yearRange: 'c-10:c+10', // Range of years to display in drop-down,
  2.             // either relative to today's year (-nn:+nn), relative to currently displayed year
  3.             // (c-nn:c+nn), absolute (nnnn:nnnn), or a combination of the above (nnnn:-n)
  4.         reverseYearRange: false, // true to display range of years in reverse order in drop-down
  5.         showOtherMonths: false, // True to show dates in other months, false to leave blank
            selectOtherMonths: false, // True to allow selection of dates in other months, false for unselectable



An example of use:

  1.                               $(document).ready(function() {
  2.                                 $("#my-date-input").datepicker({       
  3.                                                                changeYear: true,
  4.                                                                 changeMonth: true,    
  5.                                                                 yearRange: '-100:-10',
  6.                                                                 reverseYearRange: true,
  7.                                                                 defaultDate: '-10y',
  8.                                                               });
  9.                                });

You could include this enhancement in new versions of jquery-ui-datepicker plugin.

Regards