MVC3 剃刀视图错误 Microsoft JScript 运行时错误：对象不支持属性或方法"日期选取器"

Question

我正在尝试为我的 Html.EditorFor 显示日期选择器

为此，我在我的 Views\Shared\EditorTemplate 文件夹中创建了一个 EditorTemplate，命名为 DateTime.cshtml

但它不起作用，相反，我收到错误--- Microsoft JScript runtime error: Object doesn't support property or method 'datepicker'

请帮我修复此错误

这是我的剃须刀视图页面

@model MyWebRole.ViewModels.ViewModelEvents
@{
    ViewBag.Title = "Create";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)
    <fieldset style="width:50%">
        <legend>Event Details:</legend>
        <div>
            <table>
                <tr>
                 <td>
                        @Html.EditorFor(model => model.vmStartDate)
                        @Html.ValidationMessageFor(model => model.vmStartDate)
                    </td>

                </tr>
            </table>
        </div>
        <p>
            <input type="submit" value="Save" />
        </p>
    </fieldset>
}

这是我的DateTime.cshtml（粘贴在下面）

@model System.DateTime?
<div class="editor-field">
    @Html.TextBox("", String.Format("{0:MM/dd/yyyy}",(Model == DateTime.MinValue)? null : Model), new { @class="text"})
</div>
<script type="text/javascript">
    $(document).ready(function () {
        $("#@ViewData.ModelMetadata.PropertyName").datepicker({
            changeMonth: true,
            changeYear: true,
            dateFormat: 'mm/dd/yy',
            gotoCurrent: true
        });
    });
</script>

我能够让日期选择器在另一个视图上工作

  @model MyWebRole.Models.Events
    @{
        ViewBag.Title = "Edit";
        Layout = "~/Views/Shared/_Layout.cshtml";
    }
    @using (Html.BeginForm())
    {
        @Html.ValidationSummary(true)
        <fieldset style="width:50%">
            <legend>Event Details:</legend>
            <div>
                <table>
                    <tr>
                     <td>
                            @Html.EditorFor(model => model.StartDate)
                            @Html.ValidationMessageFor(model => model.StartDate)
                        </td>

                    </tr>
                </table>
            </div>
            <p>
                <input type="submit" value="Save" />
            </p>
        </fieldset>
    }

两种剃刀视图之间的区别在于-->第一个（日期选择器不起作用）正在使用ViewModel作为模型，即（mywebrole。ViewModels.EventViewModel）

-

-> 第二个是使用 myWebrole.models.Events （日期选择器工作正常）

这是一个问题吗？

Answer 1

鉴于该错误，我认为问题出在选择器上。 不要尝试以下方法，而不是 $（"#@ViewData.ModelMetadata.PropertyName"）：

$("input.text").datepicker({   ...

（或者，您可以@Html.TextBoxFor（model => model）而不是@Html.TextBox，这样输入将获得id=PropertyName，因此选择器应该可以工作）。

另外，您确定日期选择器 JQuery 插件的脚本已成功加载到页面上，对吗？