JqueryUI Datepicker 不工作 ASP.NET MVC5答案

【问题标题】：JqueryUI Datepicker not working ASP.NET MVC5JqueryUI Datepicker 不工作 ASP.NET MVC5
【发布时间】：2017-01-12 01:30:57
【问题描述】：

我安装了 jqueryUI 组合

    Install-Package jQuery.UI.Combined

将它们捆绑在 bundleconfig 中，如下所示：

bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include( "~/Scripts/jquery-ui-{version}.js"));

    bundles.Add(new StyleBundle("~/Content/themes/base/css").Include(
      "~/Content/themes/base/jquery.ui.core.css",
      "~/Content/themes/base/jquery.ui.resizable.css",
      "~/Content/themes/base/jquery.ui.selectable.css",
      "~/Content/themes/base/jquery.ui.accordion.css",
      "~/Content/themes/base/jquery.ui.autocomplete.css",
      "~/Content/themes/base/jquery.ui.button.css",
      "~/Content/themes/base/jquery.ui.dialog.css",
      "~/Content/themes/base/jquery.ui.slider.css",
      "~/Content/themes/base/jquery.ui.tabs.css",
      "~/Content/themes/base/jquery.ui.datepicker.css",
      "~/Content/themes/base/jquery.ui.progressbar.css",
      "~/Content/themes/base/jquery.ui.theme.css"));

我的看法：

<div class="input-group input-group-sm center-box">
                    <div class="text-font">Date of birth</div>
                    @Html.TextBoxFor(m => m.DateOfBirth, new { @class = "date-picker" })

和脚本：

          <script type="text/javascript">
    $(function () {
        // This will make every element with the class "date-picker" into a DatePicker element
        $('#DateOfBirth').datepicker();
    })
</script>
                </div>

And it looks like this

有什么想法吗？

【问题讨论】：

确保在 jquery-ui 之前使用引用 jquery 例如，<link rel="stylesheet" href="@Url.Content("//code.jquery.com/ui/1.12.0/themes/smoothness/jquery-ui.css")"> <script src="@Url.Content("//code.jquery.com/jquery-1.12.4.js")"></script> <script src="@Url.Content("//code.jquery.com/ui/1.12.0/jquery-ui.js")"></script>

标签： asp.net jquery-ui asp.net-mvc-5 jquery-ui-datepicker

【解决方案1】：

确保您正确添加了 jquery css 和 js 引用（最好使用 cdn 链接）
尝试用“DateOfBirth”给那个文本框ID @Html.TextBoxFor(m => m.DateOfBirth, new { @Id= "DateOfBirth", class= "date-picker" })

【讨论】：

【解决方案2】：

虽然对你来说为时已晚。可能会帮助可能正在寻找的人。

渲染 @Styles.Render("~/Content/themes/base/css") 在布局页面中。

【讨论】：