RadDatePicker, validate DateInput and IsSelectable

[TonyG]

I have a RadDatePicker in which I load SpecialDays with many RadCalendarDay objects. I set the IsSelectable property of many of these to false. When the calendar dropdown is displayed, all dates are properly enabled or disabled.
But in the DateInput the user can still enter and submit one of the dates where IsSelectable=false.

I see all of the dates are in the client.  Is there any client-side script that can be used against that data to prevent submission of an invalid date?
If we need to validate on the server, I'm not certain of what the logic should look like. The following code detects the condition but I'm not sure if this is the right way to go about it:

protected void RadDatePicker1_SelectedDateChanged( object sender , Telerik.Web.UI.Calendar.SelectedDateChangedEventArgs e )
{
    RadDatePicker picker = sender as RadDatePicker;
    if ( e.NewDate == null )
        return;
    RadCalendarDay day = picker.Calendar.SpecialDays[ e.NewDate ];
    if ( day.IsSelectable == false || day.IsDisabled == true )
    {
        // set picker to invalid state.
        // display invalid selection message.
        // stop other processing.
        return;
    }
    // date is valid, OK to continue processing
}

How would we invalidate date picker from the server like that, register a script and force the client to do it?

Thanks.

[Martin]

Hello TonyG,

You can use the OnDateSelected client side event to determine whether the entered date is not selectable. Here is a small working sample:

<asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <script type="text/javascript">
        function DateSelected(sender, args)
        {
            var date = args.get_newDate();//Get the selected date
            if (date != null)
            {
                var calendar = sender.get_calendar();//Get the calendar instance.
                var specialDaysArray = calendar.SpecialDays.GetValues()//Get the SpecialDays values
                for (var i = 0; i < specialDaysArray.length; i++)
                {
                    if (specialDaysArray[i]._date[0] == date.getFullYear() && specialDaysArray[i]._date[1] == (date.getMonth() + 1) && specialDaysArray[i]._date[2] == date.getDate())//The selected is included in SpecialDays
                    {
                        if (specialDaysArray[i].IsSelectable == 0)//The selected date is not selectable
                        {
                            sender.clear();
                            alert("The enetered date could not be selected!");
                        }
                    }
                }
            }
        }
    </script>
    <telerik:RadDatePicker runat="server" ID="RadDatePicker1" AutoPostBack="true" OnSelectedDateChanged="RadDatePicker1_SelectedDateChanged">
        <ClientEvents OnDateSelected="DateSelected" />
        <Calendar>
            <SpecialDays>
                <telerik:RadCalendarDay Date="2010-02-15" IsSelectable="false">
                </telerik:RadCalendarDay>
            </SpecialDays>
        </Calendar>
</telerik:RadDatePicker>
<asp:Label runat="server" ID="Label1"></asp:Label>

Code behind:

protected void RadDatePicker1_SelectedDateChanged(object sender, Telerik.Web.UI.Calendar.SelectedDateChangedEventArgs e)
    {
        Label1.Text = "";
        if (e.NewDate != null)
        {
            Label1.Text = e.NewDate.Value.ToLongDateString();
        }
    }

I hope this helps,
Martin
the Telerik team

Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Follow the status of features or bugs in PITS and vote for them to affect their priority.