c# - ASP.NET MVC Bootstrap Datepicker 日期验证问题

Question

我正在尝试让 Bootstrap Datepicker 工作。我遵循了这些来源的说明:

How to add Date Picker Bootstrap 3 on MVC 5 project using the Razor engine? (在 Enzero 的回答下)

&

http://bootstrap-datepicker.readthedocs.org/en/latest/options.html#format

问题是，我想使用德语格式 (dd.mm.yyyy)，而不是常见的美国 mm/dd/yyyy 格式。所以我做了以下事情:

在模型中:

[Required]
[DataType(DataType.Date)]
[Display(Name = "Datum")]
[DisplayFormat(DataFormatString = "{0:dd.MM.yyyy}", ApplyFormatInEditMode = true)]
public DateTime? Day { get; set; }

在 Web.Config 中:

<system.web>
<globalization culture="de-DE" uiCulture="de-DE" />
...
</system.web>

在 Scripts\DatePickerReady.js 中:

if (!Modernizr.inputtypes.date) {
    $(function () {
        var date = new Date();
        date.setDate(date.getDate());
        $(".datecontrol").datepicker({
            startDate: date,
            format: 'dd.mm.yyyy'
        });
    });
}

结果是这样的:

这基本上就是我想要的。现在的问题是验证表明日期格式错误。 “现场数据必须是日期”

那么问题来了，为什么验证不接受日期？

编辑#1:

我还为日期使用了 EditorTemplate:(Views/Shared/EditorTemplates/date.cshtml):

@model Nullable<DateTime>

@{
    DateTime dt = DateTime.Now;

    if (Model != null)
    {
        dt = (System.DateTime) Model;
    }

    @Html.TextBox("", String.Format("{0:d}", dt.ToShortDateString()), new { @class = "form-control datecontrol", type = "date" })
}

编辑#2: 我刚读到当您使用 TextBox(而不是 EditorFor)时无法识别 DisplayFormat。这解释了为什么验证不起作用。但我仍然不知道如何解决它。

编辑#3:

这是我在 IE F12 中看到的日期字段的 HTML 代码:

<input name="Day" class="form-control datecontrol input-validation-error" id="Day" aria-invalid="true" aria-required="true" aria-describedby="Day-error" type="date" value="11.08.2015" data-val-required="The Datum field is required." data-val="true" data-val-date="The field Datum must be a date.">

页面上加载的脚本是: jquery-2.1.4.js, bootstrap.js, bootstrap-datepicker.js, DatePickerReady.js, respond.js, jquery.validate.js, jquery.validate.unobtrusive.js

编辑#4: 我现在在 DatePickerReady.js 中使用它:

if (!Modernizr.inputtypes.date) {
    $(function () {
        var date = new Date();
        date.setDate(date.getDate());
        $(".datecontrol").datepicker({
            startDate: date,
            format: 'dd.mm.yyyy',
            autoclose: true,
            todayHighlight: true,
            weekStart: 1,
            language: 'de-DE',
            calendarWeeks: true
        });
    });
}

每个属性都有效，但“de-DE”似乎不起作用。当时的语言仍然是英语。验证问题也仍然存在。

更多信息: ASP.NET MVC 5、.NET 4.6、Bootstrap.Datepicker 1.4.0、jQuery 2.1.4、jQuery.Validation 1.14.0、Microsoft.jQuery.Unobtrusive.Validation 3.2.3

Answer 1

当我想使用“dd MMM yyyy”作为日期格式并发现解决方案是编写我自己的 jQuery 验证器代码时，我遇到了类似的问题。

$(function () {
    try {
        $.validator.addMethod('date',
        function (value, element) {
            if (this.optional(element)) {
                return true;
            }
            var ok = true;
            try {
                ok = moment(value, "dd.mm.yyyy", true).isValid();   
            } catch (err) {
                ok = false;
            }
            return ok;
        });
    } catch (e) { }
});

注意 - 这使用 moment.js 进行验证，但由于 Bootstrap datetimepicker 需要它，所以这应该不是问题。更改格式以满足您的要求。

更新 - 抱歉，刚刚意识到我上传的原始代码中存在错误。我已经对其进行了编辑，现在应该可以使用了