This is a migrated thread and some comments may be shown as answers.

how to find a raddatepicker within the radgrid during itemdatabound server event ?

7 Answers 530 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Neeraj
Top achievements
Rank 1
Neeraj asked on 11 Jun 2009, 02:39 AM
I have the following code (to find) the raddatepicker control within the radgrid, so that I can attach a onblur event to it. I am getting object reference exception within the c# code. Can someone please tell me what am I doing wrong ? these statements always return null -   RadDatePicker StartDate = (RadDatePicker)e.Item.FindControl("radBillPeriodStartDate1");  
     <telerik:RadGrid ID="gridInvLines" AllowPaging="False" Skin="Office2007"   
        runat="server" AutoGenerateColumns="False" DataSourceID="odsInvLines"   
        GridLines="None"  OnItemCommand="gridInvLines_ItemCommand" OnItemDataBound="gridInvLines_ItemDataBound" ShowFooter="True">  
        <ClientSettings > 
         <ClientEvents OnKeyPress="disableEnterKey" OnPopUpShowing="PopUpShowing" /> 
        </ClientSettings> 
        <MasterTableView DataKeyNames="LINE_NUMBER" DataSourceID="odsInvLines" EditMode="PopUp" InsertItemDisplay="Top"  AllowAutomaticInserts="true" AllowAutomaticUpdates="true" AllowAutomaticDeletes="true"  CommandItemDisplay="Top" CommandItemSettings-AddNewRecordText="Add New Line">  
            <Columns> 
                
                        <telerik:GridTemplateColumn HeaderText="Billing Period Start Date" UniqueName="BEGIN_BILLING_PERIOD_COLUMN" 
                    EditFormColumnIndex="1">  
                    <HeaderStyle Width="62px" HorizontalAlign="Center"  /> 
                    <ItemTemplate> 
                        <asp:Label runat="server" ID="lblBillingPeriodStartDate" Text='<%# Eval("BEGIN_BILLING_PERIOD", "{0:D}") %>'></asp:Label> 
                    </ItemTemplate> 
                    <EditItemTemplate> 
                        <telerik:RadDatePicker  ID="radBillPeriodStartDate1" Skin="Office2007" Style="vertical-align: middle;" 
                            runat="server"   
                            DbSelectedDate='<%# Bind("BEGIN_BILLING_PERIOD", "{0:d}") %>' 
                            MinDate='<%# DateTime.Now.AddMonths(Convert.ToInt32(ConfigurationManager.AppSettings["BillingMin"].ToString()))%>' 
                            MaxDate='<%# DateTime.Now.AddMonths(Convert.ToInt32(ConfigurationManager.AppSettings["BillingMax"].ToString()))%>' 
                                
                            > 
                            <Calendar ShowRowHeaders="false">  
                                <OutOfRangeDayStyle Font-Strikeout="true" ForeColor="red" /> 
                            </Calendar> 
                            <DateInput ID="DateInput1" runat="server" InvalidStyle-BorderColor="red" InvalidStyle-ForeColor="red" EmptyMessageStyle-BorderColor="red" EmptyMessage="  ">  
                                <ClientEvents OnKeyPress="disableEnterKey"    /> 
                            </DateInput> 
                        </telerik:RadDatePicker> 
                        <asp:RequiredFieldValidator ID="rfvBillPeriodstartDate" runat="server" ControlToValidate="radBillPeriodStartDate1" 
                            ErrorMessage="Billing Period Start Date must be within the range of 18 months in the past or 2 months in the future">*</asp:RequiredFieldValidator> 
                    </EditItemTemplate> 
                </telerik:GridTemplateColumn> 
                  
                <telerik:GridTemplateColumn HeaderText="Billing Period End Date" UniqueName="END_BILLING_PERIOD_COLUMN" 
                    EditFormColumnIndex="1">  
                    <HeaderStyle Width="62px" HorizontalAlign="Center"  /> 
                    <ItemTemplate> 
                        <asp:Label runat="server" ID="lblBillingPeriodEndDate" Text='<%# Eval("END_BILLING_PERIOD", "{0:D}") %>'></asp:Label> 
                    </ItemTemplate> 
                    <EditItemTemplate> 
                        <asp:TextBox ID="txtDate1" runat="server"></asp:TextBox> 
                        <telerik:RadDatePicker ID="radBillPeriodEndDate1"  Skin="Office2007" Style="vertical-align: middle;" 
                            runat="server" DbSelectedDate='<%# Bind("END_BILLING_PERIOD", "{0:d}") %>' 
                            MinDate='<%# DateTime.Now.AddMonths(Convert.ToInt32(ConfigurationManager.AppSettings["BillingMin"].ToString()))%>' 
                            MaxDate='<%# DateTime.Now.AddMonths(Convert.ToInt32(ConfigurationManager.AppSettings["BillingMax"].ToString()))%>' 
                            > 
                            <Calendar ShowRowHeaders="false">  
                                <OutOfRangeDayStyle Font-Strikeout="true" ForeColor="red" /> 
                            </Calendar> 
                            <DateInput ID="DateInput2" runat="server" InvalidStyle-BorderColor="red" InvalidStyle-ForeColor="red" EmptyMessageStyle-BorderColor="red" EmptyMessage="  ">  
                                <ClientEvents OnKeyPress="disableEnterKey" /> 
                            </DateInput> 
                        </telerik:RadDatePicker> 
                        <asp:RequiredFieldValidator ID="rfvBillPeriodEndDate" runat="server" ControlToValidate="radBillPeriodEndDate1" 
                            ErrorMessage="Billing Period End Date must be within the range of 18 months in the past or 2 months in the future">*</asp:RequiredFieldValidator> 
                        <asp:CompareValidator ID="cvEndDate" runat="server" ControlToValidate="radBillPeriodEndDate1" 
                            ControlToCompare="radBillPeriodStartDate1" Display="None" Operator="GreaterThanEqual" 
                            Type="Date" ErrorMessage="Billing Periond End Date must be great than or equal to Billing Period Start Date">*</asp:CompareValidator> 
                    </EditItemTemplate> 
                </telerik:GridTemplateColumn> 
                
                       </Columns> 
        
       <PopUpSettings  Modal="true" Width="600"  /> 
       </EditFormSettings> 
        </MasterTableView> 
        <ValidationSettings CommandsToValidate="PerformInsert,Update"  /> 
                    
    </telerik:RadGrid> 
 
    protected void gridInvLines_ItemDataBound(object sender, GridItemEventArgs e)  
    {  
          
 
            if (e.Item is GridDataItem)  
            {  
             
 
 
        //both these controls return null  
         RadDatePicker StartDate = (RadDatePicker)e.Item.FindControl("radBillPeriodStartDate1");  
                RadDatePicker EndDate   = (RadDatePicker)e.Item.FindControl("radBillPeriodEndDate1");  
 
                  StartDate.DateInput.Attributes.Add("onblur"string.Format("changeEndDate('{0}','{1}');", StartDate.ClientID, EndDate.ClientID));  
                   
            }  
    }  
 
 

7 Answers, 1 is accepted

Sort by
0
Princy
Top achievements
Rank 2
answered on 11 Jun 2009, 04:09 AM
Hello Neeraj,

Controls placed in the EditITemTemplate should be accessed as GridEditableItems and also these controls can be accessed only when the grid is in edit mode. The code given below should help you access the RadDatePickers:

c#:
protected void gridInvLines_ItemDataBound(object sender, GridItemEventArgs e)   
     { 
           if (e.Item is GridEditableItem && e.Item.IsInEditMode) 
            {                   
                RadDatePicker StartDate = (RadDatePicker)e.Item.FindControl("radBillPeriodStartDate1");   
                RadDatePicker EndDate   = (RadDatePicker)e.Item.FindControl("radBillPeriodEndDate1");   
  
                StartDate.DateInput.Attributes.Add("onblur"string.Format("changeEndDate('{0}','{1}');", StartDate.ClientID, EndDate.ClientID));   
                    
            }   
     }   
  

Thanks
Princy.
0
Neeraj
Top achievements
Rank 1
answered on 11 Jun 2009, 02:55 PM
Great , that did work. Now the onblur event is called when only when the user goes out of focus on the text box(dateinput) but not when the user clicks the calendar popup. how can I call this javascript event when the actual date is selected irrespective of the user click the popup button or entering the date in the textbox , I know there is a ondateselected event - but I cannot pass in my own parameters - right ? How can I achieve this ?
 function changeEndDate(startDateID, endDateID)  
              {  
                var startDateObj = $find(startDateID);   
                var endDateObj     = $find(endDateID);   
                var newMinDate   = startDateObj.get_selectedDate();  
                 
               if(newMinDate && newMinDate != null)  
                       endDateObj.set_minDate(newMinDate);  
              }  
              
if (e.Item is GridEditableItem && e.Item.IsInEditMode)  
            {  
                RadDatePicker StartDate = (RadDatePicker)e.Item.FindControl("radBillPeriodStartDate1");  
                RadDatePicker EndDate = (RadDatePicker)e.Item.FindControl("radBillPeriodEndDate1");  
 
                StartDate.DateInput.Attributes.Add("onblur"string.Format("changeEndDate('{0}','{1}');", StartDate.ClientID, EndDate.ClientID));  
            } 
0
Princy
Top achievements
Rank 2
answered on 12 Jun 2009, 08:30 AM
Hello Neeraj,

The onblur client event will fire once the focus is moved from the date input of the RadDatePicker. So on selecting a date from the calendar the dateiput should be focused. Hence, a possible solution in your case would be to set focus to the DateInput on selecting a date:
aspx:
<telerik:RadDatePicker  ID="radBillPeriodStartDate1" Skin="Office2007" Style="vertical-align: middle;"  
                            runat="server"    
                            DbSelectedDate='<%# Bind("BEGIN_BILLING_PERIOD", "{0:d}") %>'  
                            MinDate='<%# DateTime.Now.AddMonths(Convert.ToInt32(ConfigurationManager.AppSettings["BillingMin"].ToString()))%>'  
                            MaxDate='<%# DateTime.Now.AddMonths(Convert.ToInt32(ConfigurationManager.AppSettings["BillingMax"].ToString()))%>'  
                                 
                            >  
                           <ClientEvents OnDateSelected="DateSelected" /> 
 </telerik:RadDatePicker>  

js:
function DateSelected(sender, eventArgs) 
     { 
        var dateinput = sender.get_dateInput(); 
        dateinput.focus();      
       
     } 
This should help fire the on blur event of the dateinput on selecting date from the calendar or typing athe date into the input.

Hope this helps...
Princy.
0
Neeraj
Top achievements
Rank 1
answered on 15 Jun 2009, 08:09 PM
but I cannot get the id of my second control though. Here is my scenario - I have two date controls - startdate, enddate. Once user picks the startdate, this should become the mindate for the enddate control. If I use DateSelected event , how can I pass the id of the other control or how I find the other control value in the DateSelected javascript function  ?
0
Princy
Top achievements
Rank 2
answered on 16 Jun 2009, 05:31 AM
Hello Neeraj,

You should be using the onBlur event together with the OnDateSelected event to achieve the required scenario. The onblur event of the start datepicker can be used to pass the clientID's from server to client and then set the mindate for the end datepicker, which will fire only if the dateinput is focused. On selecting a date from the calendar, the dateinput is not focused, which in turn does not fire the onBlur event. So, inorder to trigger the onblur event the dateinput can be focused on selecting a date using the onDateSelected client event of the RadDatePicker.

Regards
Princy.
0
Sonny
Top achievements
Rank 1
answered on 02 Dec 2014, 07:44 PM
How would you do this with EditMode="Batch"?
0
Eyup
Telerik team
answered on 05 Dec 2014, 12:47 PM
Hello Sonny,

Please note that Batch editing is mainly a client-side functionality and in this sense, it is a better idea to implement javascript approaches in this case. For example, there are not 10 different combos generated to edit each of the records as with EditForms or PopUp edit modes, but there is only 1 combo loaded on the server which works for ideal performance and rendering optimization when opening the edit cells on the client. In addition, creating custom edit templates with Batch editing mode may require further handling:
(Section Handling Advanced Templates)
http://www.telerik.com/help/aspnet-ajax/grid-batch-editing.html

With that being said,
you can check the aforementioned article to see how to access the editors programmatically.

Hope this helps.


Regards,
Eyup
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
Grid
Asked by
Neeraj
Top achievements
Rank 1
Answers by
Princy
Top achievements
Rank 2
Neeraj
Top achievements
Rank 1
Sonny
Top achievements
Rank 1
Eyup
Telerik team
Share this question
or