how to set datetime picker in MVC4

Question

does anyone explain how to set datetime picker in MVC4 i want to select date month and year give me the instructiuon step by step

Manish Kumar Choudhary · Answer

Add cssjqryUi to your _Layout page

nizam mvc · Answer

thank you i got it @Scripts.Render("~/bundles/jqueryui") @Styles.Render("~/Content/themes/base/css", "~/Content/css")

nizam mvc · Answer

from Content folder or BoundleConfig.cs cuz Datetime picker as just renamed in BoundleConfig.cs public static void RegisterBundles(BundleCollection bundles) { bundles.Add(new ScriptBundle("~/bundles/jquery").Include( "~/Scripts/jquery-{version}.js", "~/Scripts/ jquery-ui -{version}.js"));

nizam mvc · Answer

_Layout.chtml like this gettin the calender but not gettin CSS @ViewBag.Title - My ASP.NET MVC Application @Styles.Render("~/Content/css") @Scripts.Render("~/bundles/modernizr") @RenderSection("featured", required: false) @RenderBody() &copy; @DateTime.Now.Year - My ASP.NET MVC Application @Scripts.Render("~/bundles/jquery") @RenderSection("scripts", required: false) @*Custome Edited *@ $(document).ready(function () { $('.datefield').datepicker(); })

Manish Kumar Choudhary · Answer

Otherwise go through following links it will help you http://www.asp.net/mvc/overview/older-versions/using-the-html5-and-jquery-ui-datepicker-popup-calendar-with-aspnet-mvc/using-the-html5-and-jquery-ui-datepicker-popup-calendar-with-aspnet-mvc-part-1 http://www.kestrelblackmore.com/blog/jquery-datepicker-mvc4

Manish Kumar Choudhary · Answer

Use it in your view @ Html.DisplayNameFor(model => model.DOB) @section Scripts { @ Scripts .Render( "~/bundles/jqueryval" ) @ Styles .Render( "~/Content/cssjqryUi" ) @* *@ script type ="text/javascript"> $(document).ready( function () { $( 'input[type=datetime]' ).datepicker({ dateFormat: "dd/M/yy" , changeMonth: true , changeYear: true , yearRange: "-60:+0" }); }); script > } And in your mode [ Display (Name = "Date Of Birth" )] [ DisplayFormat (ApplyFormatInEditMode = true , DataFormatString = "{0:dd/MMM/yyyy}" )] public System. DateTime DOB { get ; set ; }

how to set datetime picker in MVC4

Answers (6)