Question

简短版：

我用ASP.NET MVC3构建了一个简单的网站，我遇到了日期字段，jQuery日期选择器，验证和Mac浏览器的特殊问题。简而言之，日期字段在PC上正确验证，但在Mac上失败（我尝试过Safari和Firefox）：Mac浏览器将触发验证，声称日期格式不正确，这不是'吨。

长版：

该模型是一个“新闻”对象，在EF4.1类中定义。我想稍微“扩充”一下这个类，告诉MVC框架属性“PublishOn”是一个日期，所以我添加了这段代码：

[MetadataType(typeof(NewsMetadata))]
public partial class News
{
    // ... 
}

public class NewsMetadata
{
    [DataType(DataType.Date)]
    [Display(Name="Publish on")]
    public DateTime PublishOn { get; set; }
}

然后我在Views/Shared/EditorTemplates/中添加了一个模板，以自动将“date”css类属性添加到文本框中：

@model DateTime 
@Html.TextBox("", Model.ToString("dd-MM-yyyy"), new { @class = "date" })

最后，在我的编辑视图中，我撒了一些jQuery魔法来获得漂亮的日期选择器：

<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-ui-1.8.11.min.js")" type="text/javascript"></script>
<link href="@Url.Content("~/Content/themes/base/jquery.ui.all.css")" rel="stylesheet" type="text/css" />
<script type="text/javascript">
  $().ready(function () {
    $('.date').datepicker({ dateFormat: "dd-mm-yy" }); 
  });    
</script>

顺便说一句，关于dateFormat: "dd-mm-yy"参数的说明：如果我将其设置为“dd-mm-yyyy”，则datepicker设置错误值，为一年，即“01-01-20122012”！！奇怪。

PublishOn属性是这样完成的：

<div class="editor-label">
  @Html.LabelFor(model => model.PublishOn)
 </div>
 <div class="editor-field">
   @Html.EditorFor(model => model.PublishOn)
   @Html.ValidationMessageFor(model => model.PublishOn)
 </div>

哪个发出此HTML：

<div class="editor-label">
  <label for="PublishOn">Publish on</label>
</div>
<div class="editor-field">
  <input class="date" data-val="true" data-val-required="The Publish on field is required." id="PublishOn" name="PublishOn" type="text" value="22-12-2011" />
  <span class="field-validation-valid" data-valmsg-for="PublishOn" data-valmsg-replace="true"></span>
</div>

这完全适用于我的电脑上的IE9。但是在Mac（Firefox和Safari）上，验证开始并声称日期格式无效！

Answer 1

根据上述评论中的讨论：

禁用客户端验证使用

<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-ui-1.8.11.min.js")" type="text/javascript"></script>
<link href="@Url.Content("~/Content/themes/base/jquery.ui.all.css")" rel="stylesheet" type="text/css" />
<script type="text/javascript">
  $().ready(function () {
    $('.date').datepicker({ constrainInput: false });
  });    
</script>

[编辑] 并从相应的媒体资源中删除[DataType(DataType.Date)]。的 [/编辑]

查看http://jqueryui.com/demos/datepicker/#option-constrainInput
上的jQuery参考

Mac上的MVC3日期验证失败

1 个答案: