New to Telerik UI for ASP.NET AJAXStart a free 30-day trial

OnDateSelecting

The OnDateSelecting client-side event handler of the ASP NET AJAX Calendar is called immediately before the selected dates collection is updated to reflect the selection or deselection of a date.

The event handler receives two arguments:

  1. the RadCalendar object that fired the event.

  2. an event arguments object that exposes the following methods:OnDateSelecting event arguments object

NameReturn TypeArgumentsDescription
get_renderDay()RenderDay client-side objectReturns the client-side RenderDay object that represents the day being selected or unselected.
get_isSelecting()boolReturns true if the day is about to be selected, false if it is about to be unselected.
set_cancel(value)boolLets you prevent the selection or deselection from occurring.

The following example uses the OnDateSelecting event to confirm a change of selection and cancel the change if the user does not confirm:

ASP.NET
<telerik:RadCalendar RenderMode="Lightweight" ID="RadCalendar1" runat="server">
    <ClientEvents OnDateSelecting="confirmChange" />
</telerik:RadCalendar>

<script>
function confirmChange(sender, eventArgs) {
	var date = eventArgs.get_renderDay().get_date();
	var dfi = sender.DateTimeFormatInfo;
	var formattedDate = dfi.FormatDate(date, dfi.ShortDatePattern);
	
	eventArgs.set_cancel(!confirm("Are you sure you want to " +	(eventArgs.get_isSelecting() ? "select " : "unselect ") + formattedDate + "?"));
}
</script>

You can also use this event to perform client-side validation:

<telerik:RadCalendar runat="server" ID="RadCalendar1" RenderMode="Lightweight">
    <ClientEvents OnDateSelecting="OnDateSelecting" />
</telerik:RadCalendar>
<script>
    function OnDateSelecting(sender, args) {
        if (args.get_isSelecting()) {
            var rDay = args.get_renderDay();
            var selDates = rDay.get_date();
            var currDate = new Date();
            if (selDates[0] < currDate.getFullYear() ||
                selDates[1] < (currDate.getMonth() + 1) ||
                selDates[2] < currDate.getDate()) {
                alert("selected date is in the past and this is not allowed");
                args.set_cancel(true);
            }
        }
    }
</script>

See Also

In this article
See Also
Not finding the help you need?
Contact Support