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

Traverse Child Rows

9 Answers 306 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Rob
Top achievements
Rank 1
Rob asked on 02 Dec 2009, 04:38 PM
I have a 2 level hierarchial RadGrid.  Each row in the MasterTable will have an ItemTemplate column with RadTextbox in it.  When the users enters a value in a textbox and then tabs out (blur) I want to be able to accomplish looping through all the childrows in client side script to extract values for those children only.  I'm trying to understand how to match up a MasterTable row with gridtableview in the grid.get_detailTables() collection.  Each parent row will only ever have 1 child table.  Right now I'm just fudging it by saying that there is a 1 to 1 relationship between the # of parent rows & the # of detailTables, so the index of any parent row is equal to the index of the matching detail table.  I'm sure this is a bad assumption.  Here's what I have so far, but I'm not sure if it's fool proof:

ASPX

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="HGridScript.aspx.vb" Inherits="HGridScript" %> 
 
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
 
<html xmlns="http://www.w3.org/1999/xhtml">  
<head runat="server">  
    <title></title>  
</head> 
<body> 
    <form id="form1" runat="server">  
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">  
    </telerik:RadScriptManager> 
    <div> 
        <telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="False"   
            GridLines="None">  
            <MasterTableView ClientDataKeyNames="Something" HierarchyLoadMode="Client">  
                <Columns> 
                    <telerik:GridTemplateColumn HeaderText="Text1" UniqueName="Text1">  
                        <ItemTemplate> 
                            <telerik:RadTextBox ID="txt1" runat="server" ></telerik:RadTextBox> 
                        </ItemTemplate> 
                    </telerik:GridTemplateColumn> 
                    <telerik:GridBoundColumn DataField="Something" HeaderText="Something"></telerik:GridBoundColumn> 
                </Columns> 
                <DetailTables> 
                    <telerik:GridTableView Name="Level2" > 
                        <Columns> 
                            <telerik:GridTemplateColumn HeaderText="Text2" UniqueName="Text2">  
                                <ItemTemplate> 
                                    <telerik:RadTextBox ID="txt2" runat="server" ></telerik:RadTextBox> 
                                </ItemTemplate> 
                            </telerik:GridTemplateColumn> 
                            <telerik:GridTemplateColumn HeaderText="ext" UniqueName="ext">  
                                <ItemTemplate> 
                                    <telerik:RadTextBox ID="lblExt" runat="server" BorderColor="Transparent" ></telerik:RadTextBox> 
                                </ItemTemplate> 
                            </telerik:GridTemplateColumn> 
                            <telerik:GridBoundColumn DataField="SomethingElse" HeaderText="Something Else"></telerik:GridBoundColumn> 
                        </Columns> 
                    </telerik:GridTableView> 
                </DetailTables> 
                <RowIndicatorColumn> 
                    <HeaderStyle Width="20px"></HeaderStyle> 
                </RowIndicatorColumn> 
                <ExpandCollapseColumn> 
                    <HeaderStyle Width="20px"></HeaderStyle> 
                </ExpandCollapseColumn> 
            </MasterTableView> 
        </telerik:RadGrid> 
        <asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="GridScript()" /> 
    </div> 
        <script type="text/javascript">  
            function getItem(index) {  
                var grid = $find("<%=RadGrid1.ClientID %>")  
                var item = grid.get_masterTableView().get_dataItems()[index];  
                var lvl2Total = 0;  
                var lvl2Items = grid.get_detailTables()[index].get_dataItems();  
                for (var i = 0; i < lvl2Items.length; i++) {  
                    var txt2 = lvl2Items[i].findControl("txt2");  
                    lvl2Total += Number(txt2.get_value());  
                }  
                alert(lvl2Total);  
            }     
        </script> 
    </form> 
</body> 
</html> 
 
 

VB

Imports System.Data  
Imports Telerik.Web.UI  
 
Partial Class HGridScript  
    Inherits System.Web.UI.Page  
 
    Private Function CreateTable(ByVal ColumnName As StringByVal Value As StringAs DataTable  
        Dim dt As New DataTable  
        Dim c As New DataColumn(ColumnName)  
        dt.Columns.Add(c)  
        Dim r As DataRow = dt.NewRow  
        r(0) = Value  
        dt.Rows.Add(r)  
        r = dt.NewRow  
        r(0) = Value & " 2" 
        dt.Rows.Add(r)  
        Return dt  
    End Function 
 
    Protected Sub RadGrid1_DetailTableDataBind(ByVal source As ObjectByVal e As Telerik.Web.UI.GridDetailTableDataBindEventArgs) Handles RadGrid1.DetailTableDataBind  
        Select Case e.DetailTableView.Name  
            Case "Level2" 
                e.DetailTableView.DataSource = CreateTable("SomethingElse""else Something")  
        End Select 
    End Sub 
    Protected Sub RadGrid1_NeedDataSource(ByVal source As ObjectByVal e As Telerik.Web.UI.GridNeedDataSourceEventArgs) Handles RadGrid1.NeedDataSource  
        Me.RadGrid1.DataSource = CreateTable("Something""some Data")  
    End Sub 
 
    Protected Sub RadGrid1_PreRender(ByVal sender As ObjectByVal e As System.EventArgs) Handles RadGrid1.PreRender  
        For Each item As GridDataItem In Me.RadGrid1.MasterTableView.Items  
            CType(item("Text1").Controls(1), RadTextBox).Attributes.Add("onblur""getItem('" & item.ItemIndex.ToString & "');")  
        Next 
    End Sub 
End Class 
 

Next, I think I may need something like below.  The equivalent of the inner loop is what I really need help converting to client script.  Please help.  Thanks!

        For Each item As GridDataItem In Me.RadGrid1.MasterTableView.Items  
            For Each child As GridDataItem In item.ChildItem.NestedTableViews(0).Items  
 
            Next 
        Next 
 

9 Answers, 1 is accepted

Sort by
0
Pavlina
Telerik team
answered on 02 Dec 2009, 05:59 PM
Hi Dudeman,

I recommend you review the following help topic for more information about how to loop through all detail tables/items in Telerik RadGrid:
Traversing detail tables/items in Telerik RadGrid

All the best,
Pavlina
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Rob
Top achievements
Rank 1
answered on 02 Dec 2009, 06:18 PM
Pavlina,

Thanks for the reply, but I specifically asked how to accomplish this on the CLIENT side in script, not the server side which is the link you provided.  So how can this be accomplished in clients side script?

Also, in client side script, how to a match a parent griddataitem to a child detailtable in the grid.get_detailTables() collection?  I'm asking how to figure out the index that points from the parent row to the child table...in client script?  I see you can check the get_name() of the detail table to determine if it's level 2 or level 3 in the hierarchy, but how do I determine which detailtable index a parent row points to on the client side?

Here's what I undestand and maybe you can fill in the blanks with an explanation in this post rather than sending me a link.  Believe me, I've been through all the documentation and I wouldn't be here asking if this info existed, so....

RadGrid1.get_masterTableView().get_dataItems - contains all the rows for level 1 in a hierarchial grid.
RadGrid1.get_detailTables() - contains all the child tables for the grid which could be at any level in the hierarchy.

I'm trying to determine the link from a row in the master table to the child detail table in client side script.  So if the OnRowClicked() client event is triggered, getting the parent row should be easy, but how to get to the child rows in client side script?

Thanks.
0
Rob
Top achievements
Rank 1
answered on 02 Dec 2009, 11:39 PM
Here are the children I was looking for and for some reason it was difficult for me to track down:

GridDataItem.get_nestedViews() [0].get_dataItems();

Since I'm only working with 1 child table per parent row, the index will always be [0].  I guess it was difficult to ask a question about something I was really unfamiliar with, but now I can move forward again.
0
Pavlina
Telerik team
answered on 03 Dec 2009, 10:39 AM
Hi Dudeman,

You can get the collection of all detail tables in your grid by using the get_detailTables() client side method. This will give a collection of tables of type GridTableView. Then you could call the get_dataItems() client method to retrieve the collection of GridDataItems for each detail table in order to achieve your goal.

Find more about RadGrid client-side API here:
Getting familiar with client-side API

Let us know if we could help you further.

Sincerely yours,
Pavlina
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Rakesh
Top achievements
Rank 1
answered on 05 May 2010, 01:54 PM
alert(grdMasterTableView.get_dataItems().length);
Above code returns me zero always, though there are 10 rows
0
Rob
Top achievements
Rank 1
answered on 05 May 2010, 02:06 PM
Rakesh,

Try:

alert(grd.get_masterTableView().get_dataItems().length);
0
Rakesh
Top achievements
Rank 1
answered on 05 May 2010, 08:46 PM
Same result. returns zero. Posting my whole code:
<script language="javascript" type="text/javascript"
 
 
var grdSelected; 
var grdMasterTableView; 
function GetGridObject(sender, args) 
    grdSelected = sender; 
    grdMasterTableView = grdSelected.get_masterTableView(); 
 
function PopulateHiddenCSVCode() 
    debugger
    dataitems = grdMasterTableView.get_dataItems() 
    alert(grdSelected.get_masterTableView().get_dataItems().length); 
    var i = 0; 
    for(i = 0; i < dataitems.length; i++) 
    { 
        dataItem = grdMasterTableView.get_dataItems()[i]; 
        alert(dataItem.getDataKeyValue("ID")); 
    } 
    return false

0
Rob
Top achievements
Rank 1
answered on 05 May 2010, 09:00 PM
Get a reference to your grid like this in each JavaScrip function:

 

 

 

 

var grdSelected= $find("<%= Me.RadGrid1.ClientID %>");  
 
 
 

No need to keep a global variable for it.  Make sure "RadGrid1" equals the ID property in your <Telerik:RadGrid> tag.

0
Rakesh
Top achievements
Rank 1
answered on 07 May 2010, 09:49 PM
No luck. So now decided to create my own solution with same old fashioned text box with CSV
Tags
Grid
Asked by
Rob
Top achievements
Rank 1
Answers by
Pavlina
Telerik team
Rob
Top achievements
Rank 1
Rakesh
Top achievements
Rank 1
Share this question
or