Как исправить "Поле должно быть датой" в свойстве datetime в mvc
Мне нужно зафиксировать дату и время как для моего свойства модели. В моем классе модели у меня есть следующие
[Required]
[DataType(DataType.DateTime)]
public DateTime? CallBackDate { get; set; }
При вводе правильного времени даты (например, 28/05/2015 15:55
) я продолжаю получать эту ошибку The field CallBackDate must be a date.
Я видел подобный вопрос и пробовал разные ответы, но ничто, кажется, не избавляется от этого. Я использую ненавязчивую проверку на стороне клиента, и я не могу ее отключить.
Источник поля ввода имеет следующую разметку
<input autocomplete="off" class="jquery_datetimepicker form-control hasDatepicker" data-val="true" data-val-date="The field CallBackDate must be a date." data-val-required="The CallBackDate field is required." id="CallBackDate" name="CallBackDate" placeholder="Enter your CallBackDate" type="text" value="">
И jquery datetime picker имеет следующую разметку
$('.jquery_datetimepicker').datetimepicker({
dateFormat: 'dd/mm/yy',
minDate: 0,
showWeeks: true,
showStatus: true,
highlightWeek: true,
numberOfMonths: 1,
showAnim: "scale",
showOptions: {
origin: ["top", "left"]
},
timeFormat: 'hh:mm tt'
});
Любые идеи? спасибо
Ответы
Ответ 1
Проблемы с проверкой клиента могут возникать из-за ошибки MVC (даже в MVC 5) в jquery.validate.unobtrusive.min.js, которая не принимает формат даты/даты.. Это не вызвано datepicker или браузерами. К сожалению, вы должны решить это вручную.
Мое окончательное решение:
Вы должны включить это раньше:
@Scripts.Render("~/Scripts/jquery-3.1.1.js")
@Scripts.Render("~/Scripts/jquery.validate.min.js")
@Scripts.Render("~/Scripts/jquery.validate.unobtrusive.min.js")
@Scripts.Render("~/Scripts/moment.js")
Вы можете установить moment.js, используя:
Install-Package Moment.js
И тогда вы можете, наконец, добавить исправление для синтаксиса формата даты:
$(function () {
$.validator.methods.date = function (value, element) {
return this.optional(element) || moment(value, "DD.MM.YYYY", true).isValid();
}
});
Ответ 2
Я добавил исправление для парсера формата даты, но мне нужно было установить формат "L", чтобы он мог работать во всех локалях:
$(function () {
$.validator.methods.date = function (value, element) {
return this.optional(element) || moment(value, "L", true).isValid();
}
});
Ответ 3
В модели, например:
[Display(Name = "Insert Start Date")]
[Required(ErrorMessage = "You must specify the date of the event!")]
[DataType(DataType.DateTime, ErrorMessage = "Podaj prawidłową datę wydarzenia")]
[DisplayFormat(DataFormatString = "{0:yyyy-MM-dd HH:mm}", ApplyFormatInEditMode = true)]
public DateTime StartDate { get; set; }
[Display(Name = "Insert End Date")]
[Required(ErrorMessage = "You must specify the date of the event!")]
[DataType(DataType.DateTime, ErrorMessage = "Podaj prawidłową datę wydarzenia")]
[DisplayFormat(DataFormatString = "{0:yyyy-MM-dd HH:mm}", ApplyFormatInEditMode = true)]
public DateTime EndDate { get; set; }
И Просмотреть мой пример кода:
<script>
$('#startDate').datetimepicker({
onClose: function (dateText, inst) {
var endDateTextBox = $('#endDate');
if (endDateTextBox.val() != '') {
var testStartDate = new Date(dateText);
var testEndDate = new Date(endDateTextBox.val());
if (testStartDate > testEndDate)
endDateTextBox.val(dateText);
}
else {
endDateTextBox.val(dateText);
}
}, dateFormat: 'yy-mm-dd',
onSelect: function (selectedDateTime) {
var start = $(this).datetimepicker('getDate');
$('#endDate').datetimepicker('option', 'minDate', new Date(start.getTime()));
}
}); ....
Это вызвало положительные эффекты:
dateFormat: 'yy-mm-dd',
Ответ 4
$(function () {
$.validator.addMethod('date',
function (value, element) {
if (this.optional(element)) {
return true;
}
var valid = true;
try {
$.datepicker.parseDate('dd/mm/yy', value);
}
catch (err) {
valid = false;
}
return valid;
});
$(".datetype").datepicker({ dateFormat: 'dd/mm/yy' });
});
Поместите этот код в файл datepicker.js и включите этот файл в HTML
Ответ 5
Вам необходимо убедиться, что ваше приложение Culture правильно установлено.
Пример
В следующем примере показано, как культуры влияют на синтаксический анализ даты: https://dotnetfiddle.net/vXQTAZ
DateTime dateValue;
string dateString = "28/05/2015 15:55";
if (DateTime.TryParse(dateString, CultureInfo.CreateSpecificCulture("en-US"), DateTimeStyles.None, out dateValue))
{
Console.WriteLine("Valid en-US date.");
}
else
{
Console.WriteLine("Not a valid en-US date.");
}
if (DateTime.TryParse(dateString, CultureInfo.CreateSpecificCulture("fr-FR"), DateTimeStyles.None, out dateValue))
{
Console.WriteLine("Valid fr-FR date.");
}
else
{
Console.WriteLine("Not a valid fr-FR date.");
}
Выход
Not a valid en-US date.
Valid fr-FR date.
Настройки клиентской стороны
Вам также может потребоваться убедиться, что ваши валидаторы на стороне клиента правильно используют культуры/глобализацию. Если вы используете плагин jQuery validate с MVC, см. Это расширение, чтобы помочь изменить этот плагин в соответствии с вашими потребностями: http://blog.icanmakethiswork.io/2012/09/globalize-and-jquery-validate.html
Ответ 6
$( '# Id') removeAttr ( "данные-валин-дата" ). в Script
Ответ 7
- Теперь добавьте следующий метод в файл Additional-method.js и включите этот файл в ваш проект:
$.validator.addMethod('date',
function (value, element) {
if (this.optional(element)) {
return true;
}
var valid = true;
try {
$.datepicker.parseDate('dd/mm/yy', value);
}
catch (err) {
valid = false;
}
return valid;
});
- Вид должен быть таким:
@Html.TextBoxFor(model => model.DOB, new { @class = "datetype", type ="text" })
@Html.ValidationMessageFor(model => model.DOB)
$(function () {
$(".datetype").datepicker({ dateFormat: 'dd/mm/yy' });
});
Меня устраивает.
Ответ 8
Я должен проверить dd/mm/yyyy hh:ii
и с помощью ответа @lukyer я добавил dd/mm/yyyy hh:ii
DD/MM/YYYY HH:mm
и он работает нормально. Надеюсь, это поможет!
Ответ 9
- Установить moment.js(Install-Package Moment.js)
- Откройте jquery.validate.js и найдите метод date: function (value, element)
-
Замените содержимое для этого:
var isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);
return this.optional(element) || (isChrome ? moment(value, 'L').isValid() : !/Invalid|NaN/.test(new Date(value)));
- Готово