Onchange event for dropdownlist inside RadGrid

3 posts, 0 answers
  1. Satbir
    Satbir avatar
    6 posts
    Member since:
    May 2013

    Posted 22 Jun 2013 Link to this post

    Hi,

    In my Radgrid, i have a dropdownlist inside EditItemTemplate.

    On change of ddlAxis, depending on its value i want to enable/disable cbIsSameAxis using javascript. Below is the code.

    Pls suggest how to do this.
     
    <telerik:GridTemplateColumn UniqueName="tcAxis" HeaderText="Axis">
                                                               <ItemTemplate>
                                                                   <asp:Label ID="lblAxis" runat="server"></asp:Label>
                                                               </ItemTemplate>
                                                               <EditItemTemplate>
                                                                   <asp:DropDownList ID="ddlAxis" runat="server">
                                                                       <asp:ListItem Text="--Select--" Value="--Select--"></asp:ListItem>
                                                                       <asp:ListItem Text="PrimaryB" Value="PrimaryB"></asp:ListItem>
                                                                       <asp:ListItem Text="PrimaryT" Value="PrimaryT"></asp:ListItem>
                                                                       <asp:ListItem Text="SecondaryT" Value="SecondaryT"></asp:ListItem>
                                                                       <asp:ListItem Text="SecondaryB" Value="SecondaryB"></asp:ListItem>
                                                                   </asp:DropDownList>
                                                                   <asp:RequiredFieldValidator ID="rfvAxis" runat="server" ErrorMessage="*" ControlToValidate="ddlAxis"
                                                                       InitialValue="--Select--"></asp:RequiredFieldValidator>
                                                               </EditItemTemplate>
                                                           </telerik:GridTemplateColumn>
                                                           <telerik:GridTemplateColumn UniqueName="tcIsSameAxis" HeaderText="Is Same Axis">
                                                               <ItemTemplate>
                                                                   <asp:CheckBox ID="cbIsSameAxisDisplay" runat="server" Enabled="false" />
                                                               </ItemTemplate>
                                                               <EditItemTemplate>
                                                                   <asp:CheckBox ID="cbIsSameAxis" runat="server" />
                                                               </EditItemTemplate>
                                                           </telerik:GridTemplateColumn>
  2.
  3. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 24 Jun 2013 Link to this post

    Hi Satbir,

    Please try the following code snippet.

    ASPX:
    <telerik:RadGrid ID="RadGrid1" runat="server" OnItemCreated="RadGrid1_ItemCreated">
        <MasterTableView >
            <Columns>
                <telerik:GridTemplateColumn UniqueName="tcAxis" HeaderText="Axis">
                    <ItemTemplate>
                        <asp:Label ID="lblAxis" runat="server"></asp:Label>
                    </ItemTemplate>
                    <EditItemTemplate>
                        <asp:DropDownList ID="DropDownList1" runat="server">
                            <asp:ListItem Text="--Select--" Value="--Select--"></asp:ListItem>
                            <asp:ListItem Text="PrimaryB" Value="PrimaryB"></asp:ListItem>
                            <asp:ListItem Text="PrimaryT" Value="PrimaryT"></asp:ListItem>
                            <asp:ListItem Text="SecondaryT" Value="SecondaryT"></asp:ListItem>
                            <asp:ListItem Text="SecondaryB" Value="SecondaryB"></asp:ListItem>
                        </asp:DropDownList>
                        <asp:RequiredFieldValidator ID="rfvAxis" runat="server" ErrorMessage="*" ControlToValidate="DropDownList1"
                            InitialValue="--Select--"></asp:RequiredFieldValidator>
                    </EditItemTemplate>
                </telerik:GridTemplateColumn>
                <telerik:GridTemplateColumn UniqueName="tcIsSameAxis" HeaderText="Is Same Axis">
                    <ItemTemplate>
                        <asp:CheckBox ID="cbIsSameAxisDisplay" runat="server" Enabled="false" />
                    </ItemTemplate>
                    <EditItemTemplate>
                        <asp:CheckBox ID="CheckBox1" runat="server" />
                    </EditItemTemplate>
                </telerik:GridTemplateColumn>
            </Columns>
        </MasterTableView>
    </telerik:RadGrid>

    C#:
    protected void RadGrid1_ItemCreated(object sender, GridItemEventArgs e)
    {
     if(e.Item is GridEditableItem && e.Item.IsInEditMode)
        {
            GridEditableItem item = e.Item as GridEditableItem;
            DropDownList ddl = (DropDownList)item.FindControl("DropDownList1");
            CheckBox ck = (CheckBox)item.FindControl("CheckBox1");       
            RadGrid1.Controls.Add(new LiteralControl("<script type='text/javascript'>window['NameId'] = '" + ddl.ClientID + "';window['NameId2']= '" + ck.ClientID + "';</script>"));
            ddl.Attributes.Add("onChange", "return OnSelectedIndexChange();");
        }
    }

    JS:
    <script type="text/javascript">
        function OnSelectedIndexChange()
     {
            var Names = document.getElementById(window['NameId']);
            var Names2 = document.getElementById(window['NameId2']);
            if (Names.value == "PrimaryB")
           {
              Names2.disabled = true;
              return;
           }
            Names2.disabled = false;
     }
    </script>

    Thanks,
    Princy
  5. rajat
    rajat avatar
    2 posts
    Member since:
    Sep 2017

    Posted 19 Sep 2017 Link to this post

    Hi All,

    I have a scenario in which we have drop down list which is outside of rad grid and inside rag grid we have many controls.

    on select index change of this drop down list which is outside of rag grid i want to refresh the data source of one control which is inside rad grid without losing the data of other controls of rag grid.

    Can you please suggest how this can be achieved?

Back to Top