为什么我的引导程序DateTimePicker不起作用?

时间:2015-03-18 01:03:38

标签: c# jquery asp.net-mvc twitter-bootstrap datetimepicker

我在我的另一个MVC项目中使用过这个,当我运行该程序时代码工作正常。我现在尝试在我的新MVC应用程序中使用它,但我无法使用相同的代码。我已经添加了所有对jQuery和bootstrap的引用。

文本框显示正常,以及datetimepicker的glyphicon,当我将鼠标悬停在它上面时,鼠标变为手形符号。当我点击按钮时,那时没有任何事情发生。以下是我的代码对datetimepicker的看法:

<div class="form-group">
    @Html.LabelFor(m => m.InterviewDate, new { @class = "col-sm-2 control-label" })
    <div class="col-sm-3">
        <div class='input-group date' id='datetimepicker1'>
            @Html.TextBoxFor(m => m.InterviewDate, new { @class = "form-control" })
            <span class="input-group-addon">
                <span class="glyphicon glyphicon-calendar"></span>
            </span>
            <script type="text/javascript">
                $(function () {
                    //$('.datepicker').datepicker({
                    //    format: 'mm-dd-yyyy'
                    //});
                    $('#datetimepicker1').datetimepicker();
                });

            </script>

        </div>
    </div>
</div>

我的_Layout页面在顶部引用了这些:

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title Job Manager</title>
    <link rel="stylesheet" href="~/Content/bootstrap.min.css">
    <link rel="stylesheet" href="~/Content/bootstrap-theme.min.css">
    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="~/Content/jquery-ui.min.css">
    <link rel="stylesheet" href="~/Content/jquery-ui.theme.min.css">
    <link rel="stylesheet" href="~/Content/bootstrap-datetimepicker.min.css">
    <style type="text/css">
        body {
            margin-top: 60px;
            background: #d9edf7;
        }
    </style>
    <script src="~/Scripts/jquery-2.1.3.min.js"></script>
    <script src="~/Scripts/jquery-ui-1.11.4.min.js"></script>
    <script src="~/Scripts/moment-with-locales.js"></script>
    <script      src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
    <script src="~/Scripts/bootstrap-datetimepicker.min.js"></script>

</head>

然后在底部引用这些:

@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts", false)

如果我忘记了任何内容或您需要更多信息,请告诉我们。我感谢任何帮助!

0 个答案:

没有答案