ASP.Net @Html.TextBox 日期选择器答案

【问题标题】：ASP.Net @Html.TextBox DatepickerASP.Net @Html.TextBox 日期选择器
【发布时间】：2016-11-01 16:18:10
【问题描述】：

我正在尝试在@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();
    });
});

这就是我的文本框所拥有的：

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

结果是new {@class="getdate"} 出现在文本框中。

【问题讨论】：

尝试“.getdate”而不是#getdate

标签： javascript c# jquery asp.net datepicker

【解决方案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();
    });
});

【讨论】：

【解决方案2】：

整个代码看起来有问题，首先你要添加一个类 getdate 并且在 jquery 中你使用的是 id 选择器

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

这应该是

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

你在帮助器中缺少值参数的第二件事，应该是这样的

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

【讨论】：

【解决方案3】：

您的参数顺序不正确。它应该是第一个元素名称，然后是值，然后是 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();
});

【讨论】：

谢谢大家。我之前尝试过 .getdate ，但是最后两个参数的顺序错误。我得到了我的日期选择器，但是我的日期搜索仍然不起作用。

【解决方案4】：

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

试试：

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

您的 jquery 也在寻找 id=getdate，但您的 html 将类指定为 getdate

【讨论】：

【解决方案5】：

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

@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

【讨论】：

只是想知道，值和htmlAttributes之间不需要null参数吗？
这只是另一种接受format参数的重载形式。请参阅msdn.microsoft.com/en-us/library/… 虽然两者都有效，但为什么我们需要传递 null 的参数？