格式dd/MMM/YYYY的HTML5日期

我在使用MVC5 asp.net项目的格式dd/MMM/YYYY的日期时遇到问题。主要在Chrome上，因为它似乎只接受格式为yyyy/mm/dd的日期。格式dd/MMM/YYYY的HTML5日期

为了规范跨浏览器的行为，我使用了jquery datetimepicker组件。

我已经尝试过很多事情，但Chrome仍然在说日期无效。即使在将输入定义为文本而不是日期之后。即使我关闭了对特定组件的验证（data-val =“false”），Chrome仍然坚持将日期标记为无效。

型号：

public class order 
{ 
    [Key] 
    public int orderID { get; set; } 

    [Required] 
    public string comments { get; set; } 

    [Required] 
    [DisplayFormat(DataFormatString = "{0:dd/MMM/yyyy}", ApplyFormatInEditMode = false)] 
    [Display(Name = "Date of Shipping")] 
    public DateTime date { get; set; } 
}

查看日期输入：

<div class="form-group"> 
    @Html.LabelFor(model => model.date, htmlAttributes: new { @class = "control-label col-md-2" }) 
    <div class="col-md-10"> 
     @Html.EditorFor(model => model.date, new { htmlAttributes = new { @class = "form-control datetimepicker" } }) 
     @Html.ValidationMessageFor(model => model.date, "", new { @class = "text-danger" }) 
    </div> 
</div>

进口：

<script src="https://code.jquery.com/jquery-3.2.1.js"/script> 
<link rel="stylesheet" type="text/css" href="~/Content/jquery.datetimepicker.min.css" /> 
<script src="~/Scripts/jquery.datetimepicker.full.min.js"></script>

的Javascript：

<script type="text/javascript"> 
    jQuery.datetimepicker.setLocale('es'); 

    jQuery('#date').datetimepicker({ 
     format: 'd/M/Y', 
    }); 
</script>

来源

2017-09-06 atlus

具有'[数据类型（DataType.Date）]'和'[DisplayFormat（DataFormatString = “{0：DD/MMM/YYYY}”，ApplyFormatInEditMode =如果你使用一个jQuery的日期选择器（然后你可以删除'new {@type =“text”}' –

}如果你得到一个客户端错误，它的因为'jquery.validate'验证日期基于'MM/dd/yyyy'格式。您需要重新配置验证器以接受格式的日期 –

删除'@type =“text”' - 此属性不相关。另外你的datetimepicker格式似乎是错误的 - 它应该是'$（'＃date'）。datetimepicker（{format：“DD/MMM/YYYY”}）''。然后设置客户端验证：'$ .validator.methods.date = function（value，element）{return this.optional（element）|| $ .datetimepicker.parseDate（'DD/MMM/YYYY'，value）; }' –

我终于能够解决这个问题：

-Fisrt需要moment.js添加到您的项目，它可以使用NutGet经理加入，然后在你的页面引用：

@Scripts.Render("~/Scripts/moment-with-locales.min.js")

非常重要的是，如果使用非英语格式的日期的工作，你需要输入时刻与 - 的语言环境，如果没有，甚至改变区域后，它就会留在这里。“恩”

- 然后添加下面的Java脚本代码：

$.datetimepicker.setDateFormatter({ 
    parseDate: function (date, format) { 
     var d = moment(date, format); 
     return d.isValid() ? d.toDate() : false; 
}, 

formatDate: function (date, format) { 
    return moment(date).format(format); 
    } 
}); 

$.validator.methods.date = function (value, element) { 
    return this.optional(element) || moment(value, "DD/MMM/YYYY", 'es').isValid(); 
}

- 也注意的DateTimePicker初始化变化如下：

jQuery('#date').datetimepicker({ 
    format: 'DD/MMM/YYYY HH:mm', 
    formatTime: 'HH:mm', 
    formatDate: 'DD/MMM/YYYY' 
});

来源

2017-09-06 16:48:23 atlus

格式dd/MMM/YYYY的HTML5日期

回答

相关问题