jqueryUI datetimepicker無法正確顯示

Question

大家好，

我目前正在按照本教程實施jQuery datetimepicker。 我使用C＃，MVC和Bootstrap。 我正在為ASP.NET使用默認配置（我創建了一個默認的MVC項目），只是添加了jQuery UI。

我已經完成所有步驟，您可以在此處查看我的代碼：

 public static void RegisterBundles(BundleCollection bundles)
 {
        bundles.Add(new ScriptBundle("~/bundles/jqueryUI").Include(
                    "~/Scripts/jquery-ui-1.12.1.min.js"));

        bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                    "~/Scripts/jquery-{version}.js"));
bundles.Add(new StyleBundle("~/Content/JqueryUICSS").Include(
                 "~/Content/themes/base/jquery-ui.min.css"));
 }

使用剃刀的HTML：

<div class="form-group">
    @Html.LabelFor(m => m.ConfirmPassword, new { @class = "col-md-2 control-label" })
    <div class="col-md-10">
    @Html.PasswordFor(m => m.ConfirmPassword, new { @class = "form-control" })
    </div>
</div>

/**add here the date of birth*/
@Html.EditorFor(model => model.DateOfBirth,
new { htmlAttributes = new { @class = "form-control date-picker" } })
<div class="form-group">
    @Html.LabelFor(m => m.Genre, new { @class = "col-md-2 control-label" })
    <div class="col-md-10">

    @Html.RadioButtonFor(model => model.Genre, true)
    <span>Hombre</span>

    @Html.RadioButtonFor(model => model.Genre, false)
    <span>Mujer</span>

    </div>
</div>

和腳本部分：

@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
@Scripts.Render("~/bundles/jqueryUI")
@Scripts.Render("~/Content/JqueryUICSS")
<script src="~/Scripts/jquery-3.1.1.min.js"></script>
<script src="~/Scripts/jquery-ui-1.12.1.min.js"></script>
<script type="text/javascript">
     $(function () { $(".date-picker").datepicker({
                changeMonth: true,
                changeYear: true,
                yearRange: "-100:+0",
                dateFormat: 'dd/mm/yyyy'
            });
     });
</script>

結果，我在datetimepicker中得到了這種錯誤的顯示 。

我怎樣才能解決這個問題？ 謝謝。

Answer 1

閱讀您的評論后，我意識到當我為css渲染包時，我使用了@ Scripts.Render（“〜/ Content / JqueryUICSS”）而不是@ Styles.Render（“〜/ Content / JqueryUICSS”），謝謝！