MVC Bootstrap datetimepick无法正常工作

时间:2016-07-27 08:29:55

标签: asp.net-mvc twitter-bootstrap asp.net-mvc-4

我将Eondasdan的Bootstrap.v3.Datetimepicker安装到我的MVC项目中。

在BundleConfig.cs

        bundles.Add(new ScriptBundle("~/bundles/datepicker").Include(
                  "~/Scripts/moment.min.js",
                  "~/Scripts/bootstrap-datetimepicker.min.js"));

        bundles.Add(new StyleBundle("~/Content/datepicker").Include(
                  "~/Content/_bootstrap-datetimepicker.less",
                  "~/Content/bootstrap-datetimepicker-build.less"));

在_Layout.cshtml中

我将其添加到顶部

@Styles.Render("~/Content/datepicker")

这就到底了

@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryval")
@Scripts.Render("~/bundles/foolproof")
@Scripts.Render("~/bundles/bootstrap")
@Scripts.Render("~/bundles/datepicker")

cshtml有这个

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

但是看截图,我不认为我的datetimepicker是正确呈现的。即,鼠标指针未显示,而是普通文本光标。时间图标左对齐,也没有显示当前选择的日期等。任何想法?

屏幕截图:https://postimg.org/image/wamg3p43b/

1 个答案:

答案 0 :(得分:1)

您可能想尝试添加实际的CSS文件而不是LESS文件

替换

   bundles.Add(new StyleBundle("~/Content/datepicker").Include(
                  "~/Content/_bootstrap-datetimepicker.less",
                  "~/Content/bootstrap-datetimepicker-build.less"));

   bundles.Add(new StyleBundle("~/Content/datepicker").Include(
                  "~/Content/bootstrap-datetimepicker.css"));