My MVC5 project is having trouble with adding a date picker. I keep getting an error in the JS code and I'm not sure what I'm missing. I tried adding Nuget for datetime picker but it's still not working. The console error is:
Uncaught TypeError: undefined is not a function Create:93
(anonymous function) Create:93
Any ideas on what I might be missing here?
This is the entire page code:
I can provide the project if needed, it's a very simple project with just 3 fields.
@model TestropDownCreate.Models.TestModel
@{
ViewBag.Title = "Create";
}
<h2>Create</h2>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/moment.js"></script>
<script src="~/Scripts/moment-datepicker.js"></script>
<link href="~/Content/moment-datepicker/datepicker.css" rel="stylesheet" />
<link href="~/Content/jquery.datetimepicker.css" rel="stylesheet" />
<link href="~/Content/bootstrap-datepicker.css" rel="stylesheet" />
<script src="~/Scripts/bootstrap-datetimepicker.js"></script>
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>Model</h4>
<hr />
@Html.ValidationSummary(true)
<div class="form-group">
@Html.LabelFor(model => model.Name, new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Name)
@Html.ValidationMessageFor(model => model.Name)
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.SelectedGender, new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownListFor(model => model.SelectedGender, Model.Gender)
</div>
</div>
<div class="form-group">
<div class="input-append date control-label col-md-2">
Date
<input data-format="yyyy-MM-dd" type="text" id="datetimepicker4" />
<span class="add-on">
<i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>
</span>
</div>
</div>
// It's there where I'm having the error -->
<script type="text/javascript">
$(function () {
$('#datetimepicker4').datepicker({
pickTime: false
});
});
</script>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Create" class="btn btn-default" />
</div>
</div>
</div>
}
<div>
@Html.ActionLink("Back to List", "Index")
</div>
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
}