RadGrid FormTemplate Controls

2 posts, 0 answers
  1. Salman
    Salman avatar
    3 posts
    Member since:
    Nov 2018

    Posted 26 Mar 2019 Link to this post

    Hello,

    I am using a template form on which I have a dropdown list. Depending on the selection, I need to hide or show a couple of different labels/date pickers. While I can access the dropdown list using the SelectedIndexChanged as follows, can you please help me figure out how I can show/hide the controls? I have found similar questions asked before but have yet to found a clear response. Really appreciate your help as I've put in quite a bit of time figuring this out.

     protected void ddDuration_SelectedIndexChanged(object sender, DropDownListEventArgs e)
            {
                RadDropDownList ddDuration = (RadDropDownList)sender;
                sDuration = (string)ddDuration.SelectedValue;
                if (sDuration == "0")
                {
                    //Need to show lblStartTime and timeStart, and Hide lblFullDate. dateFull 
                } 

               else

               {

                  //Need to show lblFullDate, dateFull and Hide lblStartTime and timeStart.

               }
            }

     <telerik:RadDropDownList Width="16.8em" ID="ddDuration" runat="server" OnSelectedIndexChanged="ddDuration_SelectedIndexChanged"
                                            AutoPostBack="true">
                                            <Items>
                                                <telerik:DropDownListItem Text="Please Select" Value="">
                                                </telerik:DropDownListItem>
                                                <telerik:DropDownListItem Text="Partial" Value="0">
                                                </telerik:DropDownListItem>
                                                <telerik:DropDownListItem Text="Full Day" Value="1">
                                                </telerik:DropDownListItem>
                                            </Items>
                                        </telerik:RadDropDownList>                                   
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <asp:Label Font-Bold="true" ID="lblFullDate" runat="server"
                                            Text="FullDay Closure Date: "></asp:Label>
                                    </td>
                                    <td>
                                        <telerik:RadDatePicker ID="dateFull" runat="server" RenderMode="Classic"></telerik:RadDatePicker>
                                    </td>
                                </tr>
                                <tr>
                                    <td> 
                                        <asp:Label Font-Bold="true" ID="lblStartTime" runat="server"
                                            Text="Partial Closure Start Time: "></asp:Label></td>
                                    <td>                                    
                                        <telerik:RadDateTimePicker Width="21.2em" RenderMode="Classic"
                                            runat="server" ID="timeStart"></telerik:RadDateTimePicker>                                        
                                    </td>
                                </tr>

     

     

     

     

     

     

  2. Attila Antal
    Admin
    Attila Antal avatar
    608 posts

    Posted 29 Mar 2019 Link to this post

    Hi Salaman,

    I assume that you are referring to FormTemplate EditForm when editing a Grid records, if that is the case, let's assume you have the following Grid configuration. EditMode = EditForms, EditFormType = Template then the code snippets you've shared are in the FormTemplate.

    <telerik:RadGrid ID="RadGrid1" runat="server">
        <MasterTableView EditMode="EditForms">
            <EditFormSettings EditFormType="Template">
                <FormTemplate>
                    <telerik:RadDropDownList Width="16.8em" ID="ddDuration" runat="server" OnSelectedIndexChanged="ddDuration_SelectedIndexChanged"
                        AutoPostBack="true">
                        <Items>
                            <telerik:DropDownListItem Text="Please Select" Value=""></telerik:DropDownListItem>
                            <telerik:DropDownListItem Text="Partial" Value="0"></telerik:DropDownListItem>
                            <telerik:DropDownListItem Text="Full Day" Value="1"></telerik:DropDownListItem>
                        </Items>
                    </telerik:RadDropDownList>
                    </td>
                        </tr>
                        <tr>
                            <td>
                                <asp:Label Font-Bold="true" ID="lblFullDate" runat="server"
                                    Text="FullDay Closure Date: "></asp:Label>
                            </td>
                            <td>
                                <telerik:RadDatePicker ID="dateFull" runat="server" RenderMode="Classic"></telerik:RadDatePicker>
                            </td>
                        </tr>
                    <tr>
                        <td>
                            <asp:Label Font-Bold="true" ID="lblStartTime" runat="server"
                                Text="Partial Closure Start Time: "></asp:Label></td>
                        <td>
                            <telerik:RadDateTimePicker Width="21.2em" RenderMode="Classic"
                                runat="server" ID="timeStart">
                            </telerik:RadDateTimePicker>
                        </td>
                    </tr>
                </FormTemplate>
            </EditFormSettings>
        </MasterTableView>
    </telerik:RadGrid>

    You can check out the Accessing Cells and Rows help article that describes in more details and shows examples for accessing cells, values and controls in RadGrid.

    Here are some specific examples that you can try:

    I you would like to get reference to the controls in this form using the SelectedIndexChanged event of the RadDropDownList, you could do it as follows:

    protected void ddDuration_SelectedIndexChanged(object sender, DropDownListEventArgs e)
    {
        RadDropDownList rddl = sender as RadDropDownList;
        GridEditFormItem editFormItem = rddl.NamingContainer as GridEditFormItem;
        Label lblFullDate = editFormItem.FindControl("lblFullDate") as Label;
        RadDatePicker dateFull = editFormItem.FindControl("dateFull") as RadDatePicker;
        Label lblStartTime = editFormItem.FindControl("lblStartTime") as Label;
        RadDateTimePicker timeStart = editFormItem.FindControl("timeStart") as RadDateTimePicker;
     
        // Manipulate the controls here
    }

    You can also do it in other events, for example the ItemDataBound:

    protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
    {
        if (e.Item is GridEditFormItem && e.Item.IsInEditMode)
        {
            GridEditFormItem editFormItem = e.Item as GridEditFormItem;
     
            RadDropDownList rddl = editFormItem.FindControl("ddDuration") as RadDropDownList;
            Label lblFullDate = editFormItem.FindControl("lblFullDate") as Label;
            RadDatePicker dateFull = editFormItem.FindControl("dateFull") as RadDatePicker;
            Label lblStartTime = editFormItem.FindControl("lblStartTime") as Label;
            RadDateTimePicker timeStart = editFormItem.FindControl("timeStart") as RadDateTimePicker;
     
            string empty = string.Empty;
            // Manipulate the controls here
        }
    }

    In case the scenario you are looking for is different, please provide us a little more information on it. It would be helpful if you could share the grid markup and code behind so that we can get a better understanding on the exact configuration.

    I hope this will prove helpful.

    Kind regards,
    Attila Antal
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top