get_nestedViews() is undefined

[Aleksej]

1. I have RadGrid
2. I have DetailTable 
3. All master rows have detail rows
4. All rows expanded

Why get_nestedViews()[0] have value only for first row in master grid?!

                var grid = $find("<%=masterGrid.ClientID %>");
                 var rows = grid.get_masterTableView().get_dataItems();

                    for (var i = 0; i < rows.length; i++) {
                        if (rows[i].get_nestedViews().length > 0)
                        {
                            var nestedView = rows[i].get_nestedViews()[0];
                            .......
                        }                        

[Princy]

Hi Aleksej,

Its hard to identify the issue with so little information. Please take a look at the following help documentation to know how to
Loop through the detail tables/items in Telerik RadGrid on the client.
If this doesn't help, provide your full code snippet.

Thanks,
Princy

[Aleksej]

Hi Princy. My code is very big. I'm show you small fragment. What problem?

Master grid have 10 rows.
Detail grid for each master row, have 10 rows.
All detail rows expanded.

Why get_nestedViews() return detail view ONLY for first master row?! For 2-3-4 etc get_nestedViews() undefined!

[Princy]

Hi Aleksej,

Please take a look at the sample code snippet. The code is working fine at my end, cab you try to replicate the issue with this?

ASPX:

<telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="False" EnableHierarchyExpandAll="true" RetainExpandStateOnRebind="true" AllowPaging="True" AllowFilteringByColumn="true" OnDetailTableDataBind="RadGrid1_DetailTableDataBind" OnNeedDataSource="RadGrid1_NeedDataSource" >
    <MasterTableView DataKeyNames="CustomerID" HierarchyLoadMode="ServerBind" Name="Customers">
        <DetailTables>
            <telerik:GridTableView DataKeyNames="OrderID" Name="Orders" HierarchyLoadMode="ServerBind" HierarchyDefaultExpanded="false">
                <DetailTables>
                    <telerik:GridTableView DataKeyNames="OrderID,UnitPrice" Name="OrderDetails" Width="100%">
                        <Columns>
                            <telerik:GridBoundColumn SortExpression="UnitPrice" HeaderText="Unit Price" HeaderButtonType="TextButton" DataField="UnitPrice">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn SortExpression="Quantity" HeaderText="Quantity" HeaderButtonType="TextButton" DataField="Quantity">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn SortExpression="Discount" HeaderText="Discount" HeaderButtonType="TextButton" DataField="Discount">
                            </telerik:GridBoundColumn>
                        </Columns>
                    </telerik:GridTableView>
                </DetailTables>
                <Columns>
                    <telerik:GridBoundColumn SortExpression="OrderID" HeaderText="OrderID" HeaderButtonType="TextButton" DataField="OrderID" ReadOnly="true">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn SortExpression="OrderDate" HeaderText="Date Ordered" HeaderButtonType="TextButton" DataField="OrderDate" UniqueName="OrderDate" DataFormatString="{0:D}">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn SortExpression="Freight" HeaderText="Freight" HeaderButtonType="TextButton"
                        DataField="Freight" UniqueName="Freight">
                    </telerik:GridBoundColumn>
                </Columns>
            </telerik:GridTableView>
        </DetailTables>
        <Columns>
            <telerik:GridBoundColumn SortExpression="CustomerID" HeaderText="CustomerID" HeaderButtonType="TextButton" DataField="CustomerID">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn SortExpression="ContactName" HeaderText="Contact Name" HeaderButtonType="TextButton" DataField="ContactName">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn SortExpression="CompanyName" HeaderText="Company" HeaderButtonType="TextButton" DataField="CompanyName">
            </telerik:GridBoundColumn>
        </Columns>
    </MasterTableView>
</telerik:RadGrid>

JS:

<script type="text/javascript">
  function pageLoad() {
        var grid = $find('<%=RadGrid1.ClientID %>');
        var masterTable = grid.get_masterTableView();
        traverseChildTables(masterTable);
    }

    function traverseChildTables(gridTableView) {
        var dataItems = gridTableView.get_dataItems();
        for (var i = 0; i < dataItems.length; i++) {
            if (dataItems[i].get_nestedViews().length > 0) {
                var nestedView = dataItems[i].get_nestedViews()[0];
                var items = nestedView.get_dataItems();
                for (var i = 0; i < items.length; i++) {
                    alert(items[i].get_cell("OrderID").innerText);
                }
                alert(nestedView.get_name());
                traverseChildTables(nestedView);
            }
        }
    }
</script>

C#:

protected void RadGrid1_NeedDataSource(object source, Telerik.Web.UI.GridNeedDataSourceEventArgs e)
{
    if (!e.IsFromDetailTable)
    {
        RadGrid1.DataSource = GetDataTable("SELECT * FROM Customers");
    }
}

protected void RadGrid1_DetailTableDataBind(object source, Telerik.Web.UI.GridDetailTableDataBindEventArgs e)
{
    GridDataItem dataItem = (GridDataItem)e.DetailTableView.ParentItem;
    switch (e.DetailTableView.Name)
    {
        case "Orders":
            {
                string CustomerID = dataItem.GetDataKeyValue("CustomerID").ToString();
                e.DetailTableView.DataSource = GetDataTable("SELECT * FROM Orders WHERE CustomerID = '" + CustomerID + "'");
                break;
            }

        case "OrderDetails":
            {
                string OrderID = dataItem.GetDataKeyValue("OrderID").ToString();
                e.DetailTableView.DataSource = GetDataTable("SELECT * FROM [Order Details] WHERE OrderID = " + OrderID);
                break;
            }
    }
}

public DataTable GetDataTable(string query)
{
    String ConnString = ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString;
    SqlConnection conn = new SqlConnection(ConnString);
    SqlDataAdapter adapter = new SqlDataAdapter();
    adapter.SelectCommand = new SqlCommand(query, conn);

    DataTable myDataTable = new DataTable();

    conn.Open();
    try
    {
        adapter.Fill(myDataTable);
    }
    finally
    {
        conn.Close();
    }

    return myDataTable;
}

Thanks,
Princy

[Aleksej]

Hi Princy. I am able to read. If you have no desire to help, and tell. Here I give the cut-off example of the when in which get_nestedViews doesn't work ()

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication2._Default" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<asp:Content runat="server" ID="BodyContent" ContentPlaceHolderID="MainContent">

    <telerik:RadScriptBlock runat="server" ID="RadScriptBlock1">
        <script type="text/javascript">

            function ValueChanged(sender, args) {
                var grid = $find("<%=GridProducts.ClientID %>");
                var totalAmount = 0;
                if (grid) {
                    var Rows = grid.get_masterTableView().get_dataItems();

                    for (var i = 0; i < Rows.length; i++)
                        if (Rows[i].get_nestedViews().length > 0) {
                            var nestedView = Rows[i].get_nestedViews()[0];
                            var Details = nestedView.get_dataItems();

                            for (var j = 0; j < Details.length; j++) {
                                var detail = Details[j];
                                var txtQuntity = detail.findControl("CartValue");
                                var amount = 0;
                                if (txtQuntity.get_value() != "")
                                    amount = parseFloat(txtQuntity.get_value());
                                detail.removeCssClass("rowAmount");
                                if (amount > 0) {
                                    detail.addCssClass("rowAmount");
                                    var price = detail.get_cell("Price").innerHTML.replace(" ", "").replace(" ", "").replace(" ", "").replace(" ", "").replace(" ", "");
                                    totalAmount = totalAmount + (parseFloat(amount) * parseFloat(price));
                                }
                            }
                        }
                }
                var RadNumericTextBox1 = $find("<%=Total.ClientID %>");
                RadNumericTextBox1.set_value(totalAmount);
            }
        </script>
        </telerik:RadScriptBlock>

    <asp:Panel ID="pnlClients" runat="server">
                    <telerik:RadNumericTextBox runat="server" ID="Total" Type="Number" Visible="true" ReadOnly="true" Width="100px" ReadOnlyStyle-HorizontalAlign="Right" Font-Bold="true" BorderWidth="0">
                    </telerik:RadNumericTextBox>
    </asp:Panel>

    <telerik:RadGrid ID="GridProducts" runat="server" DataSourceID="DSProducts" AllowFilteringByColumn="True" AutoGenerateColumns="False" Visible="true" AllowSorting="false"
        ClientSettings-ClientEvents-OnTableCreated="ValueChanged" Height="750px" Width="100%">
        <ClientSettings>
            <Scrolling AllowScroll="True" UseStaticHeaders="True" ScrollHeight="750px" />
        </ClientSettings>
        <MasterTableView DataKeyNames="ProductId" DataSourceID="DSProducts" HierarchyDefaultExpanded="true">
            <ItemStyle BackColor="#ffffdd" />
            <AlternatingItemStyle BackColor="#ffffdd" />
            <DetailTables>
                <telerik:GridTableView runat="server" DataKeyNames="ProductId,SizeId,Price,Cart" DataSourceID="DSSizes" AllowFilteringByColumn="false">
                    <ParentTableRelation>
                        <telerik:GridRelationFields DetailKeyField="ProductId" MasterKeyField="ProductId" />
                    </ParentTableRelation>
                    <ColumnGroups>
                        <telerik:GridColumnGroup HeaderText="Скидки" Name="Discounts" HeaderStyle-HorizontalAlign="Center">
                        </telerik:GridColumnGroup>
                        <telerik:GridColumnGroup HeaderText="Другие" Name="OutherClients" HeaderStyle-HorizontalAlign="Center">
                        </telerik:GridColumnGroup>
                        <telerik:GridColumnGroup HeaderText="Данный" Name="ThisClient" HeaderStyle-HorizontalAlign="Center">
                        </telerik:GridColumnGroup>
                    </ColumnGroups>

                    <Columns>
                        <telerik:GridBoundColumn DataField="SizeId" UniqueName="column" Visible="False" ReadOnly="True">
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="SizeName" HeaderText="Наименование" UniqueName="column1" ReadOnly="True">
                            <HeaderStyle Width="600px"></HeaderStyle>
                            <ItemStyle VerticalAlign="Middle" Width="600px" />
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="Dn" HeaderText="Dn" UniqueName="column2" ReadOnly="True">
                            <ItemStyle HorizontalAlign="Center" />
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="Pn" ItemStyle-Width="80px" HeaderText="Pn" UniqueName="column3" ReadOnly="True">
                            <ItemStyle HorizontalAlign="Center" />
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="Price" DataFormatString="{0:n}" HeaderText="Итоговая цена" UniqueName="Price" ReadOnly="True" ItemStyle-ForeColor="Red">
                            <ItemStyle HorizontalAlign="Right" Width="60px" />
                        </telerik:GridBoundColumn>
                        <telerik:GridTemplateColumn ColumnGroupName="ThisClient" HeaderTooltip="В корзине данного клиента" UniqueName="ClientCart" HeaderImageUrl="~/Images/Grid/cart.png" HeaderStyle-HorizontalAlign="Center">
                            <ItemTemplate>
                                <telerik:RadNumericTextBox ID="CartValue" Type="Number" DbValue='<%# Eval("Cart") %>' NumberFormat-DecimalDigits="0" ShowSpinButtons="true" IncrementSettings-InterceptArrowKeys="true" IncrementSettings-InterceptMouseWheel="true" runat="server" Width="50px" MinValue="0" MaxValue="99999">
                                    <ClientEvents OnValueChanged="ValueChanged" OnBlur="ValueChanged" />
                                    <EnabledStyle CssClass="NumericTextBox_RightAligned" />
                                </telerik:RadNumericTextBox>
                            </ItemTemplate>
                        </telerik:GridTemplateColumn>
                        <telerik:GridButtonColumn ButtonType="ImageButton" Text="Показать подробную информацию" CommandName="ViewRemainders" ImageUrl="~/Images/Grid/eye_4789.png" />
                    </Columns>

                </telerik:GridTableView>
            </DetailTables>
            <Columns>
                <telerik:GridBoundColumn DataField="ProductId" DataType="System.Guid" ReadOnly="True" SortExpression="ProductId" UniqueName="ProductId" Visible="False">
                </telerik:GridBoundColumn>
                <telerik:GridBinaryImageColumn AllowFiltering="False" AllowSorting="False" DataField="ProductImage" UniqueName="Upload"
                    ImageHeight="150px" ImageWidth="200px" ResizeMode="Fit" AutoAdjustImageControlSize="true" HeaderText="Изображение" ImageAlign="Middle" ItemStyle-Width="220px" HeaderStyle-Width="220px">
                </telerik:GridBinaryImageColumn>
                <telerik:GridBoundColumn DataField="ProductName" HeaderText="Наименование товара" SortExpression="ProductName" UniqueName="ProductName" FooterStyle-HorizontalAlign="Right" FooterStyle-Font-Bold="true" Aggregate="Custom" FooterAggregateFormatString="Итого : {0:n}">
                    <ItemStyle Font-Bold="true" Font-Italic="true" Width="550px" />
                </telerik:GridBoundColumn>
            </Columns>
        </MasterTableView>
    </telerik:RadGrid>
        <asp:SqlDataSource ID="DSProducts" runat="server" ConnectionString="<%$ ConnectionStrings:DefaultConnection %>"
            SelectCommand="SELECT [ProductId], [ProductName], [ProductImage] FROM [Products] order by [Order]"></asp:SqlDataSource>
        <asp:SqlDataSource ID="DSSizes" runat="server" ConnectionString="<%$ ConnectionStrings:DefaultConnection %>"
            SelectCommand="select ps.ProductId, ps.SizeId, ps.SizeName, ps.Dn, ps.Pn, ps.Price as ProductPrice, ps.Price, c.Amount as Cart
                       from ProductsSizes ps left join Carts c on c.SizeId=ps.SizeId
                        where ps.ProductId=@ProductId and ps.SizeId is not null
                        order by  dn,pn">
            <SelectParameters>
                <asp:Parameter Name="ProductId" />
            </SelectParameters>
        </asp:SqlDataSource>
        <asp:SqlDataSource ID="DSClients" runat="server" ConnectionString="<%$ ConnectionStrings:DefaultConnection %>"
            SelectCommand="SELECT [ClientId], [ClientName] FROM [Clients] order by 2">
        </asp:SqlDataSource>
</asp:Content>

[Aleksej]

I'm fined error. Remove this event and all worked!

ClientSettings-ClientEvents-OnTableCreated="ValueChanged"


[Aleksej]

Princy, how event fired on client-side after load all data to grid (+detail)?

[Princy]

Hi Aleksej,

I guess you want to know about the RadGrid clientside events. Please take a look at the following help documentation to know about the RadGrid events and when they are fired.
RadGrid Client Events

Thanks,
Princy