DatePicker с сегодняшним днем ​​и DateFormat

Я пытался создать функцию jQuery UI для datepicker, и после прочтения всех форумов и фрагментов я понимаю, что подавляющее большинство ответов устарело и / или удалено из jQuery 1.9.1.

Очень просто, мне нужен jquery datepicker

Отобразите указатель даты с параметрами кнопок, а также сможете щелкнуть сегодня, что автоматически введет дату в мое поле ввода. На всю жизнь я не могу понять этого и хотел передать это кому-нибудь более осведомленному в jQuery / jQuery-UI.

Пробовал что-то вроде:

$(function() {
    $( "#date" ).datepicker(("setDate", new Date()){
        showButtonPanel: true,
        dateFormat: 'm-d-yy'
    });
  });

И, конечно, HTML

  <input name="date" id="date" />

Введенное значение должно быть в стандартном формате даты США: 1 мая 2013 года или 31 декабря 1999 года.

На данный момент код не выбирает текущую дату, и, очевидно, щелчок сегодня выберет только сегодняшнюю дату. Мне это нужно для автоматического заполнения поля ввода. Заранее спасибо за вашу помощь!


person hawkhorrow    schedule 03.05.2013    source источник


Ответы (2)


Я думаю, проблема в том, что большинство из нас (и я тоже) неправильно понимали функциональность кнопки «сегодня». На самом деле это всего лишь кнопка для выделения текущей даты, а не для ее выбора.

Если вам нужно поведение, при котором пользователь нажимает сегодня, а средство выбора даты выбирает текущую дату, я бы порекомендовал вам увидеть jsfiddle создал я.

Поскольку это не моя работа, и я только что провел небольшое исследование (работая с datepicker в данный момент), я обращаюсь к этому решение, которое идеально работает с jQuery 1.9.1 и jQuery UI 1.9.2.

Это код, который решает вашу проблему

$.datepicker._gotoToday = function (id) {
    var target = $(id);
    var inst = this._getInst(target[0]);
    if (this._get(inst, 'gotoCurrent') && inst.currentDay) {
        inst.selectedDay = inst.currentDay;
        inst.drawMonth = inst.selectedMonth = inst.currentMonth;
        inst.drawYear = inst.selectedYear = inst.currentYear;
    } else {
        var date = new Date();
        inst.selectedDay = date.getDate();
        inst.drawMonth = inst.selectedMonth = date.getMonth();
        inst.drawYear = inst.selectedYear = date.getFullYear();
        // the below two lines are new
        this._setDateDatepicker(target, date);
        this._selectDate(id, this._getDateDatepicker(target));
    }
    this._notifyChange(inst);
    this._adjustDate(target);
}

Надеюсь, это поможет вам :)

ИЗМЕНИТЬ

Чтобы предварительно заполнить поле ввода текущей датой, вам необходимо использовать метод setDate. Обновлен скрипка.

$('#datepicker').datepicker('setDate', new Date());
person SirDerpington    schedule 03.05.2013
comment
Ваш ответ сыграл важную роль в окончательном решении моей проблемы ... Большое вам спасибо !! однако окончательное решение было комбинацией вашего ответа и ответа Таноса - person hawkhorrow; 03.05.2013
comment
Ну, похоже, я пропустил ваш вопрос в своем решении. Какая жалость, что предварительное заполнение ввода было бы легким делом ^^ - person SirDerpington; 03.05.2013
comment
Я как раз собирался редактировать свой пост, когда увидел твой ответ. Уже создал скрипку ... только что опубликовал правку. Надеюсь, что формат даты правильный, потому что вы упомянули, что хотите, чтобы он был в стандартном американском формате. - person SirDerpington; 03.05.2013
comment
формат для стандартного нас - md-yy .... ну, это немного неверно ... mm-dd-yy и md-yy - оба формата USA, только один имеет ведущие нули, а другой чище ... я предпочитаю md- гг - person hawkhorrow; 03.05.2013
comment
Прекрасная работа. Спасибо за помощь! - person hawkhorrow; 03.05.2013
comment
Ха-ха, хорошо, я был сбит с толку, потому что вы написали стандартный формат даты США: то есть 5/1/2013 с разделителем /. Отредактировал скрипку в другой раз, теперь должно быть м-д-уу;) Добро пожаловать! - person SirDerpington; 03.05.2013

Я создал для вас ПРИМЕР 1, который, по вашему мнению, охватит то, что вы просить.

РЕДАКТИРОВАТЬ: обновлен ПРИМЕР 2 и удален первоначальный выбор даты. Теперь он начинается без какой-либо выбранной даты.

HTML

<p>Date: <input type="text" id="datepicker" /></p>

JS (не забудьте включить jQuery UI 1.9.2 и jQuery)

var $datepicker = $("#datepicker");
$datepicker.datepicker({
        showButtonPanel: true,
        dateFormat: 'm-d-yy'
    });
$datepicker.datepicker('setDate');
person Thanos    schedule 03.05.2013
comment
Однако это помогает, если я должен был переключить дату, а затем повторно щелкнуть календарь .... кнопка «Сегодня» по-прежнему не работает. Мне нравится, что onLoad, дата указана заранее ... есть идеи? - person hawkhorrow; 03.05.2013