RadGrid With Hierarchy Client Side

[DanR]

I am testing a hierarchical radgrid. I allow the user to expand a row which displays the detail table. Then the user has the option to add, update or delete records in the detail table. For the add and update I use a popup form. In the popup form I have a column the user enters that is a checkboxcolumn. If the user checks the box then I want to make the rest of the columns in the form set so the user cannot enter any information. If the user does not check the box, then they continue on entering the rest of the information. Obviously this requires javascript. I have used this before in a single level radgrid. However, I do not know how to use javascript to access this checkbox that is nested inside of a detail table. To avoid posting a great deal of code, here's a basic outline of what I have including examples of the checkbox field and a subsequent numeric entry that may or may not be needed. How do I perform a $find in javascript on the "Test1" checkbox? Thanks...

    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
    <script type="text/javascript">

    </script>
    </telerik:RadCodeBlock>
RadGrid ID=”RadGrid1”
  MasterTableView
    DetailTables
      GridTableView  EditMode=”Popup”
        EditFormSettings
          Columns
          FormTemplate
            Formview
       <telerik:GridCheckBoxColumn DataField="TestTitle"
                                   HeaderText="Title?"
                                   UniqueName="Test1">
       </telerik:GridCheckBoxColumn>
       <telerik:GridNumericColumn DataField="TestNbr"
                                  HeaderText="Number"
                                  UniqueName="Test2"
       </telerik:GridNumericColumn>

                                                        

[Princy]

Hello Dan,

You can achieve this by attaching 'onclick' client event to the CheckBox inside edit form of DetailTable. And pass the Id of CheckBox  and RadNumericTextBox to the event handler. In that event handler based on checked property of CheckBox, enable/disable RadNumericTextBox. Sample code is given below.

C#:

protected void RadGrid1_ItemCreated(object sender, GridItemEventArgs e)
   {
       if (e.Item is GridEditFormItem && e.Item.IsInEditMode && e.Item.OwnerTableView.Name == "DetailTable") // check with name of DetailTable
       {
           GridEditFormItem editItem = (GridEditFormItem)e.Item;
           CheckBox chk = (CheckBox)editItem["Test1"].Controls[0];
           RadNumericTextBox textbox = (RadNumericTextBox)editItem["Test2"].Controls[0];
           chk.Attributes.Add("onclick", "checkboxClick(this,'" + textbox.ClientID + "');");
       }
   }

Java Script:

<script type="text/javascript">
      function checkboxClick(chkID, textID) {
         var textbox = $find(textID);
         if (chkID.checked)
              textbox.set_enabled(false);
       else
             textbox.set_enabled(true);
     }
</script>

Thanks,
Princy.

[DanR]

Hi Princy:

Thanks much for your help. As my test project is in VB, I translated your c# code.

Protected Sub RadGrid1_ItemCreated(ByVal sender As Object, ByVal e As Telerik.Web.UI.GridItemEventArgs) Handles RadGrid1.ItemCreated
    If (TypeOf e.Item Is GridEditFormItem And e.Item.IsInEditMode And e.Item.OwnerTableView.Name = "AdjustLevel") Then
        Dim editItem As GridEditFormItem = DirectCast(e.Item, GridEditFormItem)
        Dim chk As CheckBox = DirectCast(editItem("Test1").Controls(0), CheckBox)
        Dim textbox As RadNumericTextBox = DirectCast(editItem("Test2").Controls(0), RadNumericTextBox)
        chk.Attributes.Add("onclick", "checkboxClick(this,'" + textbox.ClientID + "');")
    End If
End Sub

When I test I am getting an error on the "Dim chk As Checkbox..."  line of code as follows: "Item in insert mode does implement indexer only when the edit form is autogenerated". This is my fault as I sent you the wrong set of sample code. I am sorry. The sample code in my popup formview should have been:

<fieldset>
<ol>
    <li>
        <telerik:RadTextBox ID="txtAdjDesc"
                            runat="server"
                            Label="Description"
                            Text='<%# Bind("Description") %>'
                            LabelCssClass="right_Aligned"
                            MaxLength="100"
                            TextMode="MultiLine"
                            ToolTip="Enter description or title">
        </telerik:RadTextBox>
    </li>
    <li>
        <asp:Label ID="lblTest1"
               Text="Title?"
               runat="server"
               AssociatedControlID="cbTest1"
               />
        <asp:CheckBox ID="cbTest1"
                      runat="server"
                      Checked='<%# Bind("Title") %>' />
    </li>
    <li>
        <telerik:RadNumericTextBox ID="txtTest2"
                            runat="server"
                            Label="Year 1"
                            Type="Currency"
                            NumberFormat-DecimalDigits="0"
                            Text='<%# Bind("TestNbr1") %>'
                            ToolTip="" >
         </telerik:RadNumericTextBox>
    </li>
    <li>
        <telerik:RadNumericTextBox ID="txtTest3"
                            runat="server"
                            Label="Year 2"
                            Type="Currency"
                            NumberFormat-DecimalDigits="0"
                            Text='<%# Bind("TestNbr2") %>'
                            ToolTip="" >
        </telerik:RadNumericTextBox>
    </li>

As you can see, I have a basic text description column, then the checkbox, then two number fields that should be disabled if the checkbox is checked for both insert and update modes. Is the approach the same when the user is editing an existing record (in this case as the record is displayed from the DB, it would need to determine at that time the checkbox status - I am not sure this will happen if I just have an onclick???).

Thanks for your help, Dan

[DanR]

Hi:

Any ideas?

Dan