RadDatePicker, validate DateInput and IsSelectable

2 posts, 0 answers
  1. TonyG
    TonyG avatar
    239 posts
    Member since:
    Feb 2006

    Posted 07 Feb 2010 Link to this post

    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 )  
        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.  
        // 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?


  2. Martin
    Martin avatar
    833 posts

    Posted 11 Feb 2010 Link to this post

    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">
        <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
                                alert("The enetered date could not be selected!");
        <telerik:RadDatePicker runat="server" ID="RadDatePicker1" AutoPostBack="true" OnSelectedDateChanged="RadDatePicker1_SelectedDateChanged">
            <ClientEvents OnDateSelected="DateSelected" />
                    <telerik:RadCalendarDay Date="2010-02-15" IsSelectable="false">
    <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,
    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.
Back to Top