Question

我正在尝试在@Html.TextBox上添加一个日期选择器。日期字段将用作搜索条件字段，以便我可以将日期条目与表中的日期进行比较。这就是我对我的脚本所拥有的：

<link href="~/Content/ui_1.10.4_themes_smoothness_jquery-ui.css" rel="stylesheet" />
<script src=" ~/Scripts/jquery-1.10.2.js"></script>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>

<script>
$(document).ready(function () {
    $("#getdate").each(function () {
        $(this).datepicker();
    });
});

这就是我对TextBox的所作所为：

Date Received: @Html.TextBox("SearchString5",  new {@class="getdate"}, ViewBag.CurrentFilter as string)

它产生的结果是文本框中显示的单词new {@class="getdate"}。

Answer 1

这是因为你的参数混淆了Html.TextBox ..

的重载方法

他们应该是这样的：

public static MvcHtmlString TextBox(
    this HtmlHelper htmlHelper,
    string name,
    object value,
    string format,
    object htmlAttributes
)

所以根据你的具体情况：

@Html.TextBox("SearchString5",ViewBag.CurrentFilter as string, new {@class="getdate"})

此外，在您的JS中，您使用ID引用了#，但您需要引用class .。

$(document).ready(function () {
    $(".getdate").each(function () {
        $(this).datepicker();
    });
});

Answer 2

您的参数顺序不正确。它应该是，第一个元素名称，然后是值，然后是html属性。这样写：

@Html.TextBox("SearchString5",ViewBag.CurrentFilter as string, new {@class="getdate"})

请参阅this overload in documentation at MSDN

现在在jquery中使用类选择器，因为对于html的每个元素，id应该是唯一的：

$(document).ready(function () {
$(".getdate").each(function () {
    $(this).datepicker();
});

Answer 3

您的最后两个参数的顺序错误

尝试：

Date Received: @Html.TextBox("SearchString5",ViewBag.CurrentFilter as string,  new {@class="getdate"})

此外，您的jquery正在寻找id=getdate，但您的html将该类指定为getdate

Answer 4

您使用的参数顺序不正确。它应该是：

@Html.TextBox("SearchString5", "6/30/2016", new { @class="getdate" })

请参阅此重载表单：

https://msdn.microsoft.com/en-us/library/system.web.mvc.html.inputextensions.textbox(v=vs.118).aspx#M:System.Web.Mvc.Html.InputExtensions.TextBox%28System.Web.Mvc.HtmlHelper,System.String,System.Object,System.Object%29

Answer 5

整个代码看起来很麻烦，首先你要添加一个类getdate，而在jquery中你正在使用id选择器

$(document).ready(function () {
$("#getdate").each(function () {
    $(this).datepicker();
});
});

这应该是

$(document).ready(function () {
    $(".getdate").each(function () {
        $(this).datepicker();
    });
});

第二件事你在helper中缺少值参数，它应该是这样的

Date Received: @Html.TextBox("SearchString5",ViewBag.CurrentFilter as string,  new {@class="getdate"})

ASP.Net @ Html.TextBox Datepicker

5 个答案: