Intro to Telerik MVC's DatePicker Control
The freely available ASP.NET MVC framework by Telerik has added a new DatePicker control that works similarly to the RadDatePicker control in its ASP.NET AJAX framework. Below is a sample of that control:
<%
Html.Telerik().DatePicker().Name("Picker")
.ButtonTitle("Select Date")
.ClientEvents((evt) =>
{
evt.OnChange(() =>
{
%>
function(e) {
$("#output").html("Value changed to " + e.date);
}
<%
});
})
.Value(DateTime.Now)
.MaxDate(DateTime.Now.AddYears(3))
.MinDate(DateTime.Now.Subtract(new TimeSpan(1000, 0, 0, 0)))
.Render();
%>
Note that this date picker has some of the same properties as the calendar in my previous post. The MaxDate, MinDate, ClientEvents, etc are the same properties available in both, as you have access to a wide array of options available to you). The value property allows the defaulting of the current date as I've currently set, as well as a tooltip for the button, which is shown as a tooltip in the image below.
Clicking on the button shows a calendar control. Clicking on the date fires our client-side change handler. Our handler writes out the selected date to the browser as is, which renders the option below.
Currently, the selected date is 4/13/2010; clicking on the 22nd will fire the change event, making available an e.date property with the new date. By using the client-side equivalent handler, for both the date picker and calendar, you avoid the postback to the server to an action method, saving on resources.