Saturday, March 14, 2015

bootstrap 3 datetime picker V4

https://github.com/Eonasdan/bootstrap-datetimepicker/wiki/Installation#nuget

Model
 public class Instructor : Person
    {
        [DataType(DataType.Date)]
        [DisplayFormat(DataFormatString = "{0:yyyy-MM-dd HH:mm}", ApplyFormatInEditMode = true)]
        [Display(Name = "Hire Date")]
        public DateTime HireDate { get; set; }

        public virtual ICollection<Course> Courses { get; set; }
        public virtual OfficeAssignment OfficeAssignment { get; set; }
    }


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

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
<script type="text/javascript" src="@Url.Content("/Scripts/moment.min.js")"></script>
<script src="~/Scripts/bootstrap-datetimepicker.min.js"></script>
<script type="text/javascript">
    $(function () {
        $('#HireDate').datetimepicker();
    });
</script>

        }

No comments:

Post a Comment