我在我的另一个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)
如果我忘记了任何内容或您需要更多信息,请告诉我们。我感谢任何帮助!