JQuery UI Datepicker, отменяет порядок года в выпадающих меню

Ответ 1

Я бы не рекомендовал редактировать оригинальный ui.datepicker.js как Cuong, потому что ваши изменения будут потеряны, как только вы или другой разработчик замените файл при выпуске новой версии. Помня, какие настройки были сделаны для повторного применения, это непрактично. Вместо этого вы можете переопределить существующий метод _generateMonthYearHeader в своем отдельном JS, например:

// store original so we can call it inside our overriding method
$.datepicker._generateMonthYearHeader_original = $.datepicker._generateMonthYearHeader;

$.datepicker._generateMonthYearHeader = function(inst, dm, dy, mnd, mxd, s, mn, mns) {
  var header = $($.datepicker._generateMonthYearHeader_original(inst, dm, dy, mnd, mxd, s, mn, mns)),
      years = header.find('.ui-datepicker-year');

  // reverse the years
  years.html(Array.prototype.reverse.apply(years.children()));

  // return our new html
  return $('<div />').append(header).html();
}

Я только что написал это для чего-то, над чем я работаю, и он прекрасно делает трюк:)

Ответ 2

Я думаю, что лучший способ взломать плагин без его копирования - это назначить обработчик события для элемента выбора года.

//Hack for reverting year order
$(document.body).delegate('select.ui-datepicker-year', 'mousedown', function() {
  (function(sel) {
    var el = $(sel);
    var ops = $(el).children().get();
    if ( ops.length > 0 && $(ops).first().val() < $(ops).last().val() ) {
      $(el).empty();
      $(el).html(ops.reverse());
    }
  })(this);
});

Этот код должен работать нормально!: P

Ответ 3

• Откройте файл ui.datepicker.js
• Найти метод _generateMonthYearHeader: function(inst, drawMonth, drawYear, minDate, maxDate, selectedDate, secondary, monthNames, monthNamesShort)

• Найдите следующий цикл в методе

  for (; year <= endYear; year++) {
      html += '<option value="' + year + '"' +
          (year == drawYear ? ' selected="selected"' : '') +
          '>' + year + '</option>';
  }
  
  html += '</select>';
  

• Вставьте следующий код перед этим циклом:

  if (year-100 < 1900) // Check year is lower then 1900
      year = 1950;     // change start point of above loop, it helps you having the 
                       // year dropdownlist starting at 1950, and ending of current year plus 10.
  

Ответ 4

У меня есть ответ на ваш вопрос, но это не совсем то, что вы можете услышать.

После поиска в Интернете решения, которое изменило бы порядок лет в раскрывающемся списке, я пришел к следующему:

{
    changeMonth: true
    , changeYear: true
    , yearRange: '-65:'
    , maxDate: '1999/12/31'
}

Это будет предустановлен maxdate, поэтому, выбрав год, вы автоматически увидите последнюю запись, тем самым сможете прокручивать вверх, чтобы выбрать более раннюю дату.

Изменить: yearRange добавляется произвольно, чтобы создать стартовую точку 65 лет назад. maxDate также выбирается произвольно, как дата за 12 лет до написания этого комментария. В основном это меню позволит кому-то выбрать возраст от 12 до 65 лет.

Это не идеально, но он работает достаточно хорошо.

Ответ 5

Существует "способ" начать год с последней даты:

dateFormat: 'mm/dd/yy',
changeMonth: true, 
changeYear: true,  
yearRange: "-70:", 
maxDate: "-13Y"

Вместо этого, если использовать yearRange качестве фиксированного yearRange: "1900:-13" лучше использовать это снизу вверх: "-70:" и установить maxDate. Теперь я получаю поле выбора года начиная с 2004 года, а не с 1900 года.

PS: Все остальные решения были протестированы. Они очень медленные, а некоторые работают не очень хорошо (особенно старые - например, устанавливает текущий год вместо 2004 года).

Ответ 6

Замените первую строку цикла for на:

var minYear = year;
year = endYear;
for (; year >= minYear; year--) {