1

[编辑:现在工作。刚刚将 EditorFor 更改为 TextBox]

我刚开始使用 C# 中的 MVC3。我偶然发现了这个问题。

我已经按照一些教程将 datepicker 功能添加到 MVC3 项目,但是 datepicker 没有显示在我的 web 项目中。这是我所拥有的:

在我的 _Layout.chtml 文件中,我包含了所需的 jQuery 依赖文件:

<link href="@Url.Content("~/Content/themes/base/jquery.ui.core.css")" 
    rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/themes/base/jquery.ui.datepicker.css")" 
    rel="stylesheet"  type="text/css" />
<link href="@Url.Content("~/Content/themes/base/jquery.ui.theme.css")" 
    rel="stylesheet" type="text/css" />

<script src="@Url.Content("~/Scripts/jquery.ui.core.min.js")" 
    type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.ui.datepicker.min.js")" 
    type="text/javascript"></script>

这就是我的观点:

@using (Html.BeginForm()) {
@Html.ValidationSummary(true)
<fieldset>
    <legend>Student</legend>

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

    <div class="editor-label">
        @Html.LabelFor(model => model.DOB)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.DOB, new { @class = "date" })
        @Html.ValidationMessageFor(model => model.DOB)
    </div>

    <p>
        <input type="submit" value="Create" />
    </p>
</fieldset>

}

在视图内的同一个文件中,我将脚本用于将日期选择器挂接到顶部的编辑器中:

<script type="text/javascript">
$(document).ready(function () {
    $('.date').datepicker();
});

许多教程建议为此使用 EditorTemplate,但我认为没有必要。我错过了什么?感谢所有帮助的人。

4

3 回答 3

0

我不相信您可以使用 EditorFor 并通过课程。相反,请尝试:

<div class="editor-field">
    @Html.TextBoxFor(model => model.DOB, new { @class = "date" })
    @Html.ValidationMessageFor(model => model.DOB)
</div>

TextBoxFor 将接受 HTML 属性。

于 2012-08-01T11:47:22.457 回答
0

@Html.TextBoxFor()第二个参数是对象 htmlAttributes
@Html.EditorFor()第二个参数是对象additionalViewData

所以新的 { @class = "date" }对 @Html.TextBoxFor() 没有预期的效果

于 2013-01-11T18:16:51.873 回答
0

这是一个简单的工作演示,阅读

<!DOCTYPE html>
<html>
<head>
  <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

  <script>
  $(document).ready(function() {
    $("#datepicker").datepicker();
  });
  </script>
</head>
<body style="font-size:62.5%;">

<div id="datepicker"></div>

</body>
</html>
于 2012-08-01T11:53:40.150 回答