C# jQuery UI日期选择器在asp.net mvc中无法正常工作

我在MVC工作。我在“Date”控件上使用了jQuery datepicker。调用datepicker的jQuery代码如下所示：

    $(document).ready(function () {
     $('.date').datepicker({ dateFormat: "dd/mm/yy" });
     });

我的DateTime Partialview是：

     @Html.TextBoxFor(x => x.Value, new { id = Model.Name, name = Model.Name, @class = "date", @readonly = true })

我的DateTimeViewModel属性是：

    public string Name { get; set; }

   public DateTime? Value { get; set; }

我在表单中使用这个局部视图。当我填写完表格并点击提交后，焦点再次转到我的日期选择器，再次选择日期。这种情况一再发生，我的表格无法提交。 我在chrome上调试此控件，发现日期无效，如下所示：-

    <input class="ff date hasDatepicker input-validation-error" data-val="true" data-val-date="The field Value must be a date." name="Fields[Lea_ex1_47].Value" readonly="True" type="text" value="" id="dp1369308655980">

编辑 很抱歉，我提得太晚了，但我现在也注意到了。我的日期选择器只取每月1日到12日的日期。也就是说：在30/31天中，日期从1到12（验证为真），其他13到31天将出现验证错误（验证为假）

请告诉我发生这种情况的原因？我怎样才能摆脱这个呢

---

提前感谢。

能否尝试注释视图模型属性，如：

[DataType(DataType.Date)]
[DisplayFormat(DataFormatString = "{0:dd/MM/yy}", ApplyFormatInEditMode = true)]
public DateTime? Value { get; set; }

---

使用

UIHint

轻松设置日期选择器

[UIHint("DateTime")]
[DataType(DataType.Date)]
[DisplayFormat(DataFormatString = "{0:MM/dd/yyyy}", ApplyFormatInEditMode = true)]
[Display(Name = "Due Date")]
public Nullable<System.DateTime> Value{ get; set; }

[UIHint（“DateTime”）]
[数据类型（DataType.Date）]
[DisplayFormat（DataFormatString=“{0:MM/dd/yyyy}”，ApplyFormatInEditMode=true）]
[显示（Name=“到期日”）]
公共可空值{get；set；}

在此路径中添加DateTime.cshtml文件Shared/EditorTemplates

@model Nullable<System.DateTime>
@if (Model.HasValue)
{
    @Html.TextBox("", String.Format("{0:MM/dd/yyyy}", Model.Value), new { placeholder = "MM/DD/YYYY" })
}
else
{
    @Html.TextBox("", null, new { placeholder = "MM/DD/YYYY" })
}
@{
    string name = ViewData.TemplateInfo.HtmlFieldPrefix;
    string id = name.Replace(".", "_");
}
<script type="text/javascript">
    $(function () {
        $("#@id").datepicker({
            dateFormat: "mm/dd/yy"
        });
    });
</script>

@模型可为空
@if（Model.HasValue）
{
@Html.TextBox（“，String.Format（“{0:MM/dd/yyyy}”，Model.Value），新的{placeholder=“MM/dd/yyyyy”}）
}
其他的
{
@Html.TextBox（“”，null，新的{placeholder=“MM/DD/YYYY”}）
}
@{
字符串名称=ViewData.TemplateInfo.HtmlFieldPrefix；
字符串id=name.Replace（“.”，“”）；
}
$（函数（）{
$（“#@id”）.datepicker({
日期格式：“mm/dd/yy”
});
});

可能是这一部分： 这不是.NET显示日期的默认方式，因此jQuery可能无法解析它。您需要确保日期早于月份，年份为2位数

编辑：在阅读了您关于控件失败的编辑后，当日期大于12时，这肯定是导致失败的原因。但是，我在下面提到的问题在您修复日期格式后可能仍然会导致问题

其他潜在问题： 您正在设置一个

readonly

HTML属性，我不知道您为什么要这样做：

@readonly = true

这将不执行任何操作或禁止弹出日期选择器

最后，我注意到您正在手动设置名称和ID：

id = Model.Name, name = Model.Name

这是

Model.Value

的编辑器，为什么要将它连接到

Model.Name

？您页面中的其他内容是否具有相同的ID？其他表单字段是否具有相同的名称？如果是这样，它很可能会破坏客户端和服务器上的东西。你甚至不需要指定这些；MVC助手方法可以为您做到这一点

怎么办： 首先，按照一些人的建议注释ViewModel，但要确保格式正确：

[UIHint("DateTime")]
[DataType(DataType.Date)]
[DisplayFormat(DataFormatString = "{0:dd/mm/yy}", ApplyFormatInEditMode = true)]
public DateTime? Value { get; set; }

它应该修复它，但是也要考虑从代码中删除<代码> ID <代码> > <代码>名称>代码>和<代码> Read Ont/Cuth>属性。< /P> 如果您使用的是HTML5，那么使用

EditorFor

而不是

TextBoxFor

可能会有所帮助。这将导致它使用HTML5

DateTime

输入类型。jQueryUI在处理文本框方面应该不会有任何问题，但这不会有什么坏处

@Html.EditorFor(x => x.Value, new { @class = "date" })

---

作为一种解决方法，我在提交期间重新格式化文本框日期选择器的值，以便将其格式化回mm/dd/yy

$('#submit').submit(function() {

var dateTypeVar = $('#txtDateBirth').datepicker('getDate');
var oldFormat = $.datepicker.formatDate('mm/dd/yy', dateTypeVar);
                  $('#txtDateBirth').val(oldFormat);
});

何时回发mvc将能够知道现在的格式

---

希望这有助于

在尝试APROACH时不要更改问题为什么有

readonly=true

？根据您的编辑，它肯定是日期格式。查看我的答案以了解解释和修复方法。日期的EditorFor选项不允许您使用HTML属性来设置类-您需要创建自定义HTML帮助程序。

$('#submit').submit(function() {

var dateTypeVar = $('#txtDateBirth').datepicker('getDate');
var oldFormat = $.datepicker.formatDate('mm/dd/yy', dateTypeVar);
                  $('#txtDateBirth').val(oldFormat);
});