Show Datepicker into TextBox in asp.net MVC5

By following the steps below easily showing datepicker in mvc5 :


Step 1:

In Bundle.config fileinside App_start folder……………
Type the following with script

public static void RegisterBundles(BundleCollection bundles)
{
bundles.Add(newScriptBundle(“~/bundles/jquery”).Include(
“~/Scripts/jquery-{version}.js”));

// Use the development version of Modernizr to develop with and learn from. Then, when you’re
// ready for production, use the build tool athttp://modernizr.com to pick only the tests you need.
bundles.Add(newScriptBundle(“~/bundles/modernizr”).Include(
“~/Scripts/modernizr-*”));

bundles.Add(newScriptBundle(“~/bundles/bootstrap”).Include(
“~/Scripts/bootstrap.js”,
“~/Scripts/respond.js”));

bundles.Add(new StyleBundle(“~/Content/css”).Include(
“~/Content/bootstrap.css”,
“~/Content/site.css”));
}

Step 2:

In view page ……

http://@Url.Content(
http://@Url.Content(

@Html.TextBox(“datepicker”, “”, new { @class = “form-control” })

@Html.TextBox(“datepicker2”, “”, new { @class = “form-control” })

$(‘#datepicker2’).datepicker(
{
beforeShowDay: function (date) {
// var Highlight = SelectedDates[date];
var hilight = [true, ”];

return hilight;
}
}
);

//To disable specific dates……..

var activeDays = [1, 4, 10, 21, 22, 23, 27, 28, 30];

$(‘#datepicker’).datepicker(
{
beforeShowDay: function (date) {
var hilight = [false, ”];

if (activeDays.indexOf(date.getDate()) > -1) {
hilight = [true, ‘isActive’];
}

return hilight;
}
}
);