9

我需要在 EditorFor 字段上使用 datepicker。

我的视图代码是:

<div class="editor-label">
    @Html.Label("birthDate","birthDate")
</div>
<div class="editor-field">
    @Html.EditorFor(model => model.birthDate, new { @class = "datepicker"})
    @Html.ValidationMessageFor(model => model.birthDate)
</div>

剧本:

<script type="text/javascript">
$(document).ready(
    function () {
        $('.datepicker').datepicker({
            changeMonth: true,
            changeYear: true,
            minDate: "-99Y",
            dateFormat: "dd/mm/yyyy"
        });
    });

我不能让它工作。我有以下错误:Microsoft JScript 运行时错误:对象不支持此属性或方法“datepicker”。

在尝试调用该函数之前,我已经加载了 jQuery。

4

3 回答 3

9
@Html.EditorFor(model => model.birthDate, new { @class = "datepicker"})

不起作用,因为“EditorFor”不会接受(传递给 DOM)Class

因此,您需要使用将接受 Class 或更好的“TextBoxFor”,创建一个 EditorTemplate来处理任何作为 DateTime 的字段并在那里添加该类。此链接详细说明了如何制作模板。

一旦你的类工作(可以在源代码中验证),剩下的只是引用 jquery 代码。我用

@Styles.Render("~/Content/themes/base/css")
@Scripts.Render("~/bundles/jqueryval")
@Scripts.Render("~/bundles/jqueryui")

并使用您已有的脚本激活它。注意名称“.datepicker”与类完全相同。

于 2014-04-17T20:19:54.047 回答
4

编辑为我接班

@Html.EditorFor(model => model.Birthday, new { htmlAttributes = new { @class = "datepicker",@Name="birthday",@PlaceHolder = "mm/dd/yyyy" } })

html标记

class="datepicker text-box single-line"

课堂是工作。

于 2015-08-19T07:17:59.220 回答
1

我有一个类似的问题,通过使用支持日期时间的 HTML5 功能解决,在您的示例中,我建议尝试这样的事情:

<div class="editor-label">
    @Html.Label("birthDate","birthDate")
</div>
<div class="editor-field">
    @Html.EditorFor(model => model.birthDate, new { @class = "datepicker", type="datetime-local"})
    @Html.ValidationMessageFor(model => model.birthDate)
</div>

我唯一添加的是类型="datetime-local"

于 2018-03-08T13:18:23.337 回答