如何在mvc中的datetime属性上修复"该字段必须是日期"

Question

我需要为我的模型属性捕获日期和时间.在我的模型课中,我有以下内容

[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日期时间选择器具有以下标记

$('.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'
});

有任何想法吗？谢谢

Answer 1

由于jquery.validate.unobtrusive.min.js中的MVC错误(即使在MVC 5中),它不会以任何方式接受日期/日期时间格式,因此可能会发生客户端验证问题.它不是由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();
    }
});

Answer 2

我添加了日期格式解析器的修复程序,但我需要将格式设置为"L",以便它可以在所有Locales中使用:

$(function () {
$.validator.methods.date = function (value, element) {
    return this.optional(element) || moment(value, "L", true).isValid();
}
});

Answer 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',

Answer 4

您需要确保应用程序的文化设置正确。

例子

以下示例显示文化如何影响日期解析：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 验证插件与 MVC 结合使用，请参阅此扩展以帮助修改该插件以满足您的需求：http ://blog.icanmakethiswork.io/2012/09/globalize-and-jquery-validate.html