Telerik is a leading vendor of ASP.NET AJAX, ASP.NET MVC, Silverlight, WinForms and WPF controls and components, as well as .NET Reporting, .NET ORM , .NET CMS, Code Analysis, Mocking, Team Productivity and Automated Testing Tools. Building on its expertise in interface development and Microsoft technologies, Telerik helps customers build applications with unparalleled richness, responsiveness and interactivity. Telerik products help thousands of companies to be more productive and deliver reliable applications under budget and on time.
Version Q1 2012 released 04/11/2012
select

Grid / Several Tables at a Level

 EmployeeIDFirst NameLast NameTitleBirth DateCity
12
 Page 1 of 2, items 1 to 7 of 8.
2AndrewFullerVice President, Sales2/19/1952 12:00:00 AMTacoma
 
Sales per Employee
Customer NameCountryCityAddress
12345678910...
 Page 1 of 14, items 1 to 7 of 96.
Christina BerglundSwedenLuleåBerguvsvägen 8
Frédérique CiteauxFranceStrasbourg24, place Kléber
Laurence LebihanFranceMarseille12, rue des Bouchers
Elizabeth LincolnCanadaTsawassen23 Tsawassen Blvd.
Elizabeth LincolnCanadaTsawassen23 Tsawassen Blvd.
Victoria AshworthUKLondonFauntleroy Circus
Patricio SimpsonArgentinaBuenos AiresCerrito 333
Products
Product NameQuantity Per UnitUnitPrice
12345678910...
 Page 1 of 35, items 1 to 7 of 241.
Alice Mutton20 - 1 kg tins39.00
Outback Lager24 - 355 ml bottles15.00
Rössle Sauerkraut25 - 825 g cans45.60
Tarte au sucre48 pies49.30
Guaraná Fantástica12 - 355 ml cans4.50
Pâté chinois24 boxes x 2 pies24.00
Rhönbräu Klosterbier24 - 0.5 l bottles7.75
3JanetLeverlingSales Representative8/30/1963 12:00:00 AMKirkland
4MargaretPeacockSales Representative9/19/1937 12:00:00 AMRedmond
5StevenBuchananSales Manager3/4/1955 12:00:00 AMLondon
6MichaelSuyamaSales Representative7/2/1963 12:00:00 AMLondon
7RobertKingSales Representative5/29/1960 12:00:00 AMLondon
8LauraCallahanInside Sales Coordinator1/9/1958 12:00:00 AMSeattle

  • This example represents a custom interaction with the Telerik RadGrid hierarchy model.

    You can have more than one table in a hierarchy level. The tables that reside in the same level should be declared in the DetailTables collection of their parent table. Furthermore, to display several tables at one level in hierarchical grid, you will need to set appropriate ParentTableRelations for the parent/child tables included in the corresponding relation.
    Then you only need to generate the datasources for the detail tables and bind them in the NeedDataSource event. Similar solution can be implemented in the DetailTableDataBind handler of the grid.

    Note that hierarchical structure is not supported with simple data-binding (calling DataBind()). See the Simple data binding demo from the Populating with data section for more info about the limitations of this binding mode.

Source Code

C# VB.NET
Show code in new window Demo isolation steps
  • <%@ Page Language="vb" %>

    <%@ Register TagPrefix="telerik" Namespace="Telerik.QuickStart" %>
    <%@ Register TagPrefix="telerik" TagName="Header" Src="~/Common/Header.ascx" %>
    <%@ Register TagPrefix="telerik" TagName="HeadTag" Src="~/Common/HeadTag.ascx" %>
    <%@ Register TagPrefix="telerik" TagName="Footer" Src="~/Common/Footer.ascx" %>
    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
    <script runat="server">
        'In .Net2.0 RadGrid is bound on PreRender so we need to make sure
        'the grid items are already available before trying to expand.
        'That's why we use PreRenderComplete Page event to expand an item

        Protected Sub Page_PreRenderComplete(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.PreRenderComplete
            If Not IsPostBack Then
                If Not Page.IsPostBack Then
                    RadGrid1.MasterTableView.Items(0).Expanded = True
                End If
            End If
        End Sub
    </script>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <telerik:HeadTag runat="server" />
    </head>
    <body class="BODY">
        <form runat="server" id="mainForm" method="post">
        <telerik:Header runat="server" ID="Header1" NavigationLanguage="VB" />
        <telerik:RadScriptManager ID="RadScriptManager" runat="server" />
        <!-- content start -->
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="RadGrid1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>
        <telerik:RadGrid ID="RadGrid1" DataSourceID="SqlDataSource1" runat="server" Width="95%"
            AutoGenerateColumns="False" PageSize="7" AllowSorting="True" AllowPaging="True"
            GridLines="None" ShowStatusBar="true">
            <PagerStyle Mode="NumericPages" />
            <MasterTableView DataSourceID="SqlDataSource1" DataKeyNames="EmployeeID" AllowMultiColumnSorting="True"
                Width="100%">
                <Columns>
                    <telerik:GridBoundColumn SortExpression="EmployeeID" HeaderText="EmployeeID" HeaderButtonType="TextButton"
                        DataField="EmployeeID" Resizable="True" Reorderable="True" />
                    <telerik:GridBoundColumn SortExpression="FirstName" HeaderText="First Name" HeaderButtonType="TextButton"
                        DataField="FirstName" Resizable="True" Reorderable="True" />
                    <telerik:GridBoundColumn SortExpression="LastName" HeaderText="Last Name" HeaderButtonType="TextButton"
                        DataField="LastName" Resizable="True" Reorderable="True" />
                    <telerik:GridBoundColumn SortExpression="Title" HeaderText="Title" HeaderButtonType="TextButton"
                        DataField="Title" Resizable="True" Reorderable="True" />
                    <telerik:GridBoundColumn SortExpression="BirthDate" HeaderText="Birth Date" HeaderButtonType="TextButton"
                        DataField="BirthDate" Resizable="True" Reorderable="True" />
                    <telerik:GridBoundColumn SortExpression="City" HeaderText="City" HeaderButtonType="TextButton"
                        DataField="City" Resizable="True" Reorderable="True" />
                </Columns>
                <DetailTables>
                    <telerik:GridTableView AutoGenerateColumns="false" Caption="Sales per Employee" AllowSorting="false"
                        DataSourceID="SqlDataSource2" Width="100%" PageSize="7">
                        <ParentTableRelation>
                            <telerik:GridRelationFields DetailKeyField="EmployeeID" MasterKeyField="EmployeeID" />
                        </ParentTableRelation>
                        <Columns>
                            <telerik:GridBoundColumn SortExpression="ContactName" HeaderText="Customer Name"
                                HeaderButtonType="TextButton" DataField="ContactName" Resizable="True" Reorderable="True" />
                            <telerik:GridBoundColumn SortExpression="Country" HeaderText="Country" HeaderButtonType="TextButton"
                                DataField="Country" Resizable="True" Reorderable="True" />
                            <telerik:GridBoundColumn SortExpression="City" HeaderText="City" HeaderButtonType="TextButton"
                                DataField="City" Resizable="True" Reorderable="True" />
                            <telerik:GridBoundColumn SortExpression="ShipAddress" HeaderText="Address" HeaderButtonType="TextButton"
                                DataField="ShipAddress" Resizable="True" Reorderable="True" />
                        </Columns>
                    </telerik:GridTableView>
                    <telerik:GridTableView Caption="Products" AllowSorting="false" AutoGenerateColumns="false"
                        DataSourceID="SqlDataSource3" Width="100%">
                        <ParentTableRelation>
                            <telerik:GridRelationFields DetailKeyField="EmployeeID" MasterKeyField="EmployeeID" />
                        </ParentTableRelation>
                        <Columns>
                            <telerik:GridBoundColumn SortExpression="ProductName" HeaderText="Product Name" HeaderButtonType="TextButton"
                                DataField="ProductName" Resizable="True" Reorderable="True" />
                            <telerik:GridBoundColumn SortExpression="QuantityPerUnit" HeaderText="Quantity Per Unit"
                                HeaderButtonType="TextButton" DataField="QuantityPerUnit" Resizable="True" Reorderable="True" />
                            <telerik:GridBoundColumn SortExpression="UnitPrice" HeaderText="UnitPrice" HeaderButtonType="TextButton"
                                DataField="UnitPrice" Resizable="True" Reorderable="True" />
                        </Columns>
                    </telerik:GridTableView>
                </DetailTables>
            </MasterTableView>
        </telerik:RadGrid>
        <asp:SqlDataSource ID="SqlDataSource1" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
            ProviderName="System.Data.SqlClient" SelectCommand="SELECT * FROM Employees"
            runat="server" />
        <asp:SqlDataSource ID="SqlDataSource2" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
            ProviderName="System.Data.SqlClient" SelectCommand="SELECT Orders.OrderID, Customers.City, Orders.ShipAddress, Customers.ContactName, Customers.Country
                                        FROM (Orders JOIN Customers on Orders.CustomerID = Customers.CustomerID)
                                        Where EmployeeID = @EmployeeID" runat="server">
            <SelectParameters>
                <asp:Parameter Name="EmployeeID" Type="string" />
            </SelectParameters>
        </asp:SqlDataSource>
        <asp:SqlDataSource ID="SqlDataSource3" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
            ProviderName="System.Data.SqlClient" SelectCommand="SELECT Orders.OrderID, Products.ProductName, Products.QuantityPerUnit, Products.UnitPrice
                                        FROM (([Order Details] JOIN Products on [Order Details].ProductId = Products.ProductId) JOIN Orders on [Order Details].OrderID = Orders.OrderId)
                                        Where EmployeeID = @EmployeeID" runat="server">
            <SelectParameters>
                <asp:Parameter Name="EmployeeID" Type="string" />
            </SelectParameters>
        </asp:SqlDataSource>
        <!-- content end -->
        <telerik:Footer runat="server" ID="Footer1" />
        </form>
    </body>
    </html>

Get more than expected!

Take your time to truly experience the power of RadControls for ASP.NET AJAX with a free 60-day trial backed up by Telerik’s unlimited dedicated support.

Download your RadControls for ASP.NET AJAX trial and jumpstart your development with the available Getting Started resources.

If you have any questions, do not hesitate to contact us at sales@telerik.com.

Copyright 2002-2012 © Telerik. All right reserved
Telerik Inc, 201 Jones Rd, Waltham, MA 02451