Использование HTML 5 DatePicker с полем ввода даты
Я пытаюсь узнать больше о датах HTML5. Я добавил следующий код в представление MVC Core 2.1:
<label asp-for = "DOB" class = "control-label"></label>
@{
var minDate = DateTime.Now.AddYears(-99).Date;
var maxDate = DateTime.Now.AddYears(-18).Date;
var defaultDate = DateTime.Now.AddYears(-25).Date;
}
<input asp-for = "DOB" class = "datefield" type = "date" min=@minDate max=@maxDate value=@defaultDate/>
<span asp-validation-for = "DOB" class = "text-danger"></span>
Отрисованный HTML выглядит так:
<input class = "datefield" type = "date" min = "23/10/1919 00:00:00" max = "23/10/2000 00:00:00" value = "23/10/1993 00:00:00" data-val = "true" data-val-required = "The DOB field is required." id = "DOB" name = "DOB" />
У меня есть несколько вопросов:
1) Значение даты по умолчанию не отображается, т.е. оно говорит: дд / мм / гг. Если я изменю свой код MVC на это, он будет работать:
<input asp-for = "DOB" class = "datefield" type = "date" min=@minDate max=@maxDate value = "1900-01-01"/>
Почему он не принимает переменную специально для значения по умолчанию?
2) Есть ли какие-либо последствия изменения класса на: datefield (from: form-control) в представлении MVC.
3) Можно ли указать дату по умолчанию для календаря без отображения значения в поле ввода?
Ответы 1
Значение ввода даты должно быть в формате гггг-мм-дд. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date#Value
Не могли бы вы объяснить, как эта ссылка отвечает на мой вопрос?
Обратите внимание, что я просто хочу, чтобы календарь предлагал определенную дату для начала, т.е. текстовое поле ввода не должно быть заполнено.
Я провел некоторое исследование, но нет свойства значения по умолчанию, которое ведет себя таким образом afaik
Спасибо. Каков стандартный подход к полю даты рождения? Не могли бы вы ввести значение по умолчанию. Мое приложение связано с финансами и означает, что пользователи должны быть старше 18 лет. Firefox открывает календарь на октябрь 2018 года, что означает, что вам нужно прокрутить назад. Я мог бы добавить дату по умолчанию, которая была 18 лет назад или, может быть, 17 лет назад, поэтому возникает ошибка проверки, означающая, что пользователь должен сознательно ее изменить. Что вы думаете? Спасибо.
Невозможно указать дату начала для календаря, если вы полагаетесь на встроенный элемент управления браузера. Хотя нативный интерфейс обычно лучше для пользователя, особенно на мобильных устройствах, его не очень настраивать. Если вам нужен больший контроль над календарем, как обычно, вам следует использовать библиотеку datepicker JavaScript вместо элемента управления браузера.
@ Крис Пратт, спасибо. Я использую Modernizr, чтобы определить, поддерживает ли браузер HTML5, а затем отображать Datepicker, если это не так. Является ли «стандартной практикой» просто принять тот факт, что Firefox запускается с текущей даты, или есть обходной путь (при использовании поля DOB)?
@ w0051977 Проблема в том, что каждый браузер по-разному обрабатывает ввод даты. Используя библиотеку, вы будете уверены, что она везде работает одинаково. Указание атрибута max отлично работает в Chrome. При раскрытии даты по умолчанию устанавливается максимально доступная дата.
@AlbertVanHalen, каков стандартный способ приближения к полю Доба? Должен ли я использовать datepicker modernizr независимо от того, поддерживает ли браузер html5? Спасибо.
@ w0051977 Нет стандартного способа ... Лично я ненавижу javascript datepickers на мобильных устройствах из-за того, что виртуальная клавиатура все еще присутствует и, следовательно, не отображает сгенерированный html для календаря полностью. Например, нативный datepicker на iOS идеален. Реализация (если поддерживается) отличается в разных браузерах, что тоже отстой! Я обычно использую 3 разных поля выбора: для дня, месяца и года ...
@AlbertVanHalen, спасибо. Знаете ли вы о каких-либо проектах с открытым исходным кодом (желательно .NET Core MVC), в которых используются три поля datepickers? Я бы хотел посмотреть. +1 за предложение из трех полей.
Спасибо. Сможете ли вы ответить на третий пункт, прежде чем я отмечу ваш ответ?