JQuery Date Picker, где ввод текста только для чтения

Question

Я хочу использовать средство выбора даты Jquery. Я настроил его, используя опцию alt field. Я отображаю D / M / Y в текстовом поле, но отправляю Y-M-D. Пока все работает нормально, отправка правильных данных и т. Д.

Однако я хочу запретить пользователю вводить дату вручную. Первоначально я установил для поля INPUT значение «отключено», которое работало во всех браузерах, кроме IE В IE появится всплывающее окно выбора даты, но оно не закроется после нажатия на дату.

Кто-нибудь знает лучший способ сделать это?

Answer 1

Чтобы пользователь не мог вручную редактировать ввод, я бы прикрепил событие нажатия клавиши и вернул false / запретить использование по умолчанию из его обработчика. Таким образом, если у него есть javascript, он может использовать средство выбора даты, а если нет, он может вручную редактировать ввод.

$("#input-id").keypress(function (e)
{
    e.preventDefault();
});

Answer 2

Расширение ответа nc3b:

$("#input-id").keydown(function (e)
{e.preventDefault();});

предотвратит такие ключи, как возврат, удаление и т. Д. В противном случае у вас может быть дата, например 11/11/2012, и пользователь может перенести ее на 11/11/2011, и технически это будет действительной датой JS.

Answer 3

Вы также можете сделать это:

<input type="text" id="datepicker" name="datepicker" readonly="readonly" />

См. Атрибут readonly выше.

Если вы также хотите, чтобы календарь отображался, когда <input> имеет фокус, добавьте:

$("#datepicker").datepicker({ showOn: 'both' });

Answer 4

После отключения поля ввода используйте метод уничтожения, чтобы удалить средство выбора даты. При повторном включении поля просто заново создайте указатель даты.

$("#target").datepicker("destroy");