Question

我试图将DatePicker添加到MVC5中的“编辑和创建视图”中。我在网上关注了一些教程。一个是JavaScript，另一个是Bootstrap。无论哪种方式，我都发现错误，我很困惑。

让我们开始使用Bootstrap，因为我已经从js教程中删除了所有代码。这是我的位置：

我用NuGet安装了BootStrap.Datepicker

在我的模型中，我的日期字段如下所示：

     [Key]
    [DataType(DataType.Date)]
    [DisplayFormat(DataFormatString = "{0:MM-dd-yyyy}", ApplyFormatInEditMode = true)]
    [Display(Name = "Transaction Date")]
    [Column(Order = 1, TypeName = "date")]

    [Column(TypeName = "date")]
    [DisplayFormat(DataFormatString = "{0:MM-dd-yyyy}", ApplyFormatInEditMode = true)]
    [Display(Name = "Disposition Date")]
    public DateTime? DISPOSITION_DT { get; set; }

我将以下内容添加到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.min.css"));

在我的_Layout.cshtml

中添加了以下内容

    @Styles.Render("~/Content/datepicker")
    @Scripts.Render("~/bundles/datePicker")

这是我的编辑视图的一个示例，其中有一个日期字段

        <div class="form-group">
        @Html.LabelFor(model => model.DISPOSITION_DT, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.DISPOSITION_DT, new { htmlAttributes = new { @class = "datepicker form-control" } })
            @Html.ValidationMessageFor(model => model.DISPOSITION_DT, "", new { @class = "text-danger" })
        </div>
    </div>

我的脚本位于视图底部

<script>
$(document).ready(function () {
    $('.datetimepicker').datetimepicker({
        format: 'lll'
    });
});

@Scripts.Render("~/bundles/jqueryval")

}

加载视图时，出现以下错误。。。

错误：对象不支持属性或方法“ datetimepicker”

我的研究告诉我，这可能是由于我的js文件无法正确加载。但是，我不明白为什么或如何解决它。

感谢您的帮助。请记住，我是MVC5和Bootstrap和C＃的新手。我以前以asp.net Web表单vb.net进行编码。。并使用ajax工具快速添加过去的日期选择器。我的工作正在朝着新的方向发展，我是一只老狗，试图学习新的把戏。

Answer 1

我回答了我自己的问题。。。。

我关注的教程中有拼写错误

这不是“〜/ Scripts / bootstrap-datetimepicker.min.js

它是：bootstrap-datepicker.min.js

问题已解决。日期选择器现在正在工作。

适用于MVC5，C＃的DatePicker

1 个答案: