JQuery-UI datepicker по умолчанию

У меня проблема с jQuery-UI datepicker, я искал и искал, но я не нашел ответа. У меня есть следующий код:

<script type="text/javascript">
$(function() {               
    $("#birthdate" ).datepicker({
        changeMonth: true,
        changeYear: true,
        yearRange: '1920:2010',
        dateFormat : 'dd-mm-yy',
        defaultDate: '01-01-1985'
    });
});
</script>

Я хочу, чтобы при щелчке пользователем на вкладке #birthdate, выбранном текущей датой 01-01-1985, теперь она устанавливает текущую дату.

Ответ 1

Попробуйте передать объект Date. Я не понимаю, почему он не работает в том формате, который вы ввели:

<script type="text/javascript">
$(function() {               
    $("#birthdate" ).datepicker({
        changeMonth: true,
        changeYear: true,
        yearRange: '1920:2010',
        dateFormat : 'dd-mm-yy',
        defaultDate: new Date(1985, 00, 01)
    });
});
</script>

http://api.jqueryui.com/datepicker/#option-defaultDate

Укажите фактическую дату через Дата или как строка в текущая датаФормат, или количество дней с сегодняшнего дня (например, +7) или строки значений и периодов ( "y" в течение многих лет, "м" в течение нескольких месяцев, "w" в течение нескольких недель, "d" для дней, например. '+ 1m + 7d'), или null для сегодня.

Ответ 2

Вы можете попробовать с кодом ниже.

Это приведет к тому, что дата по умолчанию станет датой, которую вы ищете.

$('#birthdate').datepicker("setDate", new Date(1985,01,01) );

Ответ 3

Увидев это:

Установите дату для выделения при первом открытии, если поле пустое. Укажите фактическую дату через объект Date или как строку в текущем dateFormat или несколько дней с сегодняшнего дня (например, +7) или строку значений и периодов ( "y" в течение многих лет, "m" в течение нескольких месяцев, "w" в течение недель, "d" в течение нескольких дней, например "+ 1m + 7d" ), или null на сегодняшний день.

Если текущий dateFormat не распознается, вы все равно можете использовать объект Date с помощью new Date(year, month, day)

В вашем примере это должно работать (я его не тестировал):

<script type="text/javascript">
$(function() {               
    $("#birthdate" ).datepicker({
        changeMonth: true,
        changeYear: true,
        yearRange: '1920:2010',
        dateFormat : 'dd-mm-yy',
        defaultDate: new Date(1985,01,01)
    });
});
</script>

Ответ 4

jQuery UI Datepicker кодируется, чтобы всегда выделять локальную дату пользователя, используя класс ui-state-highlight. Нет встроенной опции, чтобы изменить это.

Один метод, описанный аналогичным образом в других ответах на связанные вопросы, заключается в переопределении CSS для этого класса в соответствии с ui-state-default вашей темы, например:

.ui-state-highlight {
    border: 1px solid #d3d3d3;
    background: #e6e6e6 url(images/ui-bg_glass_75_e6e6e6_1x400.png) 50% 50% repeat-x;
    color: #555555;
}

Однако это не очень полезно, если вы используете динамические темы, или если вы намерены выделить другой день (например, чтобы "сегодня" основываться на часах вашего сервера, а не на клиенте).

Альтернативный подход заключается в переопределении прототипа datepicker, который отвечает за выделение текущего дня.

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


Если ваша цель состоит в том, чтобы предотвратить выделение текущего дня:

// copy existing _generateHTML method
var _generateHTML = jQuery.datepicker.constructor.prototype._generateHTML;
// remove the string "ui-state-highlight"
_generateHtml.toString().replace(' ui-state-highlight', '');
// and replace the prototype method
eval('jQuery.datepicker.constructor.prototype._generateHTML = ' + _generateHTML);

Это изменяет соответствующий код (неминимали для удобочитаемости):

[...](printDate.getTime() == today.getTime() ? ' ui-state-highlight' : '') + [...]

к

[...](printDate.getTime() == today.getTime() ? '' : '') + [...]

Если ваша цель - изменить определение датпикера "сегодня":

var useMyDateNotYours = '07/28/2014';
// copy existing _generateHTML method
var _generateHTML = jQuery.datepicker.constructor.prototype._generateHTML;
// set "today" to your own Date()-compatible date
_generateHTML.toString().replace('new Date,', 'new Date(useMyDateNotYours),');
// and replace the prototype method
eval('jQuery.datepicker.constructor.prototype._generateHTML = ' + _generateHTML);

Это изменяет соответствующий код (неминимали для удобочитаемости):

[...]var today = new Date();[...]

к

[...]var today = new Date(useMyDateNotYours);[...]
// Note that in the minimized version, the line above take the form `L=new Date,`
// (part of a list of variable declarations, and Date is instantiated without parenthesis)

Вместо useMyDateNotYours вы, конечно же, можете вместо этого ввести строку, функцию или что-то, что вам подходит.

Ответ 5

JQuery Datepicker defaultDate ТОЛЬКО устанавливает дату по умолчанию, выбранную вами в календаре, который появляется при нажатии на ваше поле. Если вы хотите, чтобы дата по умолчанию была APPEAR на вашем входе до того, как пользователь нажмет на это поле, вы должны указать val() в свое поле. Что-то вроде этого:

$("#searchDateFrom").datepicker({ defaultDate: "-1y -1m -6d" });
$("#searchDateFrom").val((date.getMonth()) + '/' + (date.getDate() - 6) + '/' + (date.getFullYear() - 1));

Ответ 6

Если вы хотите обновить выделенный день до другого дня на основе некоторого времени сервера, вы можете переопределить код выбора даты, чтобы разрешить новую настраиваемую опцию с именем localToday или все, что вы хотели бы назвать.

Небольшое исправление выбранного ответа в jQuery UI DatePicker change подсвечивается "сегодня" дата

// Get users 'today' date
var localToday = new Date();
localToday.setDate(tomorrow.getDate()+1); // tomorrow

// Pass the today date to datepicker
$( "#datepicker" ).datepicker({
    showButtonPanel: true,
    localToday: localToday    // This option determines the highlighted today date
});

Я переопределил 2 метода datepicker, чтобы условно использовать новый параметр для "сегодняшней" даты вместо new Date(). Новая настройка называется localToday.

Переопределить $.datepicker._gotoToday и $.datepicker._generateHTML следующим образом:

$.datepicker._gotoToday = function(id) {
    /* ... */
    var date = inst.settings.localToday || new Date()
    /* ... */
}

$.datepicker._generateHTML = function(inst) {
    /* ... */
    tempDate = inst.settings.localToday || new Date()
    /* ... */
}

Здесь demo, который показывает полный код и использование: http://jsfiddle.net/NAzz7/5/

Ответ 7

$("#birthdate" ).datepicker("setDate", new Date(1985,01,01))