Generic Method to Set Max Date on RadDatePicker

4 posts, 1 answers
  1. Stacey Haslag
    Stacey Haslag avatar
    30 posts
    Member since:
    Oct 2009

    Posted 18 Nov 2009 Link to this post

    I have a page with multiple RadDatePicker controls. For each control, I want the MaxDate to be the current date. So I created a Javascript method to set this. This is working fine. However, I don't wnat to have to create a unique Javascript method for each individual RadDatePicker to call.

    Does anyone know a work-around for this situation? (I definately don't know my way around Javascript).  Is there a way I can pass as a parameter the ID of the particular RadDatePicker control, and use the parameter variable to find that control on the page?

    Function to set the max date of my RadDatePicker:
    function RadDatePicker_SetMaxDateToCurrentDate() {  
            var datePicker = $find("<%= txtTest.ClientID %>");  
            datePicker.set_maxDate(new Date());          
         }; 
     

    One of many RadDatePicker controls on my page:  

    <telerik:RadDatePicker ID="txtTest" runat="server" MinDate="1900-01-01" >                                      
        <DateInput ID="DateInput2" DateFormat="MMMM yyyy" runat="server" ReadOnly="true">  
        </DateInput> 
        <Calendar ID="CalendarInput2" runat="server">  
            <SpecialDays> 
                <telerik:RadCalendarDay repeatable="Today" Date="" ItemStyle-CssClass="rcToday" /> 
            </SpecialDays>                                          
            <ClientEvents OnLoad="RadDatePicker_SetMaxDateToCurrentDate" /> 
        </Calendar> 
    </telerik:RadDatePicker> 

     

     

     

  2. Johny
    Johny avatar
    80 posts
    Member since:
    Aug 2008

    Posted 23 Nov 2009 Link to this post

    Hi Stacey,

    You can try the following code:

    <script type="text/javascript"
            function RadDatePicker_SetMaxDateToCurrentDate(sender, args) 
            { 
                var id = sender.get_id().substr(0, sender.get_id().indexOf("_")) 
                var picker = $find(id); 
                picker.set_maxDate(new Date()); 
            }  
         
        </script> 
     
        <telerik:RadDatePicker ID="RadDatePicker1" runat="server" MinDate="1900-01-01"
            <DateInput ID="DateInput1" DateFormat="MMMM yyyy" runat="server" ReadOnly="true"
            </DateInput> 
            <Calendar ID="CalendarInput1" runat="server"
                <SpecialDays> 
                    <telerik:RadCalendarDay Repeatable="Today" Date="" ItemStyle-CssClass="rcToday" /> 
                </SpecialDays> 
                <ClientEvents OnLoad="RadDatePicker_SetMaxDateToCurrentDate" /> 
            </Calendar> 
        </telerik:RadDatePicker> 
        <telerik:RadDatePicker ID="RadDatePicker2" runat="server" MinDate="1900-01-01"
            <DateInput ID="DateInput2" DateFormat="MMMM yyyy" runat="server" ReadOnly="true"
            </DateInput> 
            <Calendar ID="Calendar2" runat="server"
                <SpecialDays> 
                    <telerik:RadCalendarDay Repeatable="Today" Date="" ItemStyle-CssClass="rcToday" /> 
                </SpecialDays> 
                <ClientEvents OnLoad="RadDatePicker_SetMaxDateToCurrentDate" /> 
            </Calendar> 
        </telerik:RadDatePicker> 

    I hope this helps,
    Johny
  3. Stacey Haslag
    Stacey Haslag avatar
    30 posts
    Member since:
    Oct 2009

    Posted 25 Nov 2009 Link to this post

    Thanks for the suggestion Johny,
     
    I tried this:
    var id = sender.get_id().substr(0, sender.get_id().indexOf("_"))          
            var picker = $find(id);  
            alert("id=" + id + "        picker=" + picker); 
     Which returned this:
    id=ctl00         picker=null

    So it didn't work.

    then I tried this:
            var id2 = sender.get_id();  
            var picker2 = $find(id2);  
            alert("id2=" + id2 + "        picker2=" + picker2);  
            picker2.set_maxDate(new Date()); 
    Which returned this:
    id2=ctl00_cphBody_rptDetails_ctl01_txtDateOfCondition_calendar      picker2=[object Ojbect]

    So I thought it would work, but when it executes the picker2.set_maxDate(new Date()) line, I get a "Error: Object doesn't support this property or method" error message.

  4. Answer
    Johny
    Johny avatar
    80 posts
    Member since:
    Aug 2008

    Posted 26 Nov 2009 Link to this post

    Hi Stacey,

    The code from my previous post will not work in master / content page scenarios. In this case you can try:

    <script type="text/javascript"
            var date = new Date(); 
            function RadDatePicker_SetMaxDateToCurrentDate(sender, args) 
            { 
                var arr = new Array(date.getFullYear(), date.getMonth() + 1, date.getDate()); 
                sender.set_rangeMaxDate(arr); 
            }   
        </script>  
      
        <telerik:RadDatePicker ID="RadDatePicker1" runat="server" MinDate="1900-01-01">  
            <DateInput ID="DateInput1" DateFormat="MMMM yyyy" runat="server" ReadOnly="true">  
            </DateInput>  
            <Calendar ID="CalendarInput1" runat="server">  
                <SpecialDays>  
                    <telerik:RadCalendarDay Repeatable="Today" Date="" ItemStyle-CssClass="rcToday" />  
                </SpecialDays>  
                <ClientEvents OnLoad="RadDatePicker_SetMaxDateToCurrentDate" />  
            </Calendar>  
        </telerik:RadDatePicker>  
        <telerik:RadDatePicker ID="RadDatePicker2" runat="server" MinDate="1900-01-01">  
            <DateInput ID="DateInput2" DateFormat="MMMM yyyy" runat="server" ReadOnly="true">  
            </DateInput>  
            <Calendar ID="Calendar2" runat="server">  
                <SpecialDays>  
                    <telerik:RadCalendarDay Repeatable="Today" Date="" ItemStyle-CssClass="rcToday" />  
                </SpecialDays>  
                <ClientEvents OnLoad="RadDatePicker_SetMaxDateToCurrentDate" />  
            </Calendar>  
        </telerik:RadDatePicker>  


    I hope this helps.
    Johny
Back to Top