Saturday, October 24, 2015

Telerik Grid Master Details:


1 First add the reference of Telerik UI.
2 Design the form as follows:
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
    <div>
    <telerik:RadGrid ID="RadGrid1"  ShowStatusBar="true"
            DataSourceID="SqlDataSource1" runat="server"AutoGenerateColumns="False" PageSize="7"
            AllowSorting="True" AllowMultiRowSelection="False"AllowPaging="True" GridLines="None">
            <PagerStyle Mode="NumericPages"></PagerStyle>
            <MasterTableView EnableHierarchyExpandAll="true"DataSourceID="SqlDataSource1" DataKeyNames="CustomerID"AllowMultiColumnSorting="True">
                <DetailTables>
                    <telerik:GridTableViewEnableHierarchyExpandAll="true" DataKeyNames="OrderID"DataSourceID="SqlDataSource2" Width="100%"
                        runat="server">
                        <ParentTableRelation>
                            <telerik:GridRelationFieldsDetailKeyField="CustomerID" MasterKeyField="CustomerID"></telerik:GridRelationFields>
                        </ParentTableRelation>
                        <Columns>
                            <telerik:GridBoundColumnSortExpression="OrderID" HeaderText="OrderID"HeaderButtonType="TextButton"
                                DataField="OrderID"UniqueName="OrderID">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumnSortExpression="Date" HeaderText="Date Ordered"HeaderButtonType="TextButton"
                                DataField="Date" UniqueName="Date"DataFormatString="{0:D}">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumnSortExpression="Freight" HeaderText="Freight"HeaderButtonType="TextButton"
                                DataField="Freight"UniqueName="Freight">
                            </telerik:GridBoundColumn>
                        </Columns>
                        <SortExpressions>
                            <telerik:GridSortExpressionFieldName="Date"></telerik:GridSortExpression>
                        </SortExpressions>
                    </telerik:GridTableView>
                </DetailTables>
                <Columns>
                    <telerik:GridBoundColumnSortExpression="CustomerID" HeaderText="CustomerID"HeaderButtonType="TextButton"
                        DataField="CustomerID"UniqueName="CustomerID">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumnSortExpression="ContactName" HeaderText="Contact Name"HeaderButtonType="TextButton"
                        DataField="ContactName"UniqueName="ContactName">
                    </telerik:GridBoundColumn>
                </Columns>
                <SortExpressions>
                    <telerik:GridSortExpressionFieldName="ContactName"></telerik:GridSortExpression>
                </SortExpressions>
            </MasterTableView>
        </telerik:RadGrid>
    <asp:SqlDataSource ID="SqlDataSource1" ConnectionString="Data Source=ABC;Initial Catalog=ABC; User ID=sa;Password=abc"
        ProviderName="System.Data.SqlClient" SelectCommand="SELECT * FROM Customers"
        runat="server"></asp:SqlDataSource>
    <asp:SqlDataSource ID="SqlDataSource2" ConnectionString="Data Source=ABC;Initial Catalog=ABC; User ID=sa;Password=abc"
        ProviderName="System.Data.SqlClient" SelectCommand="SELECT * FROM Orders Where CustomerID = @CustomerID"
        runat="server">
        <SelectParameters>
            <asp:SessionParameter Name="CustomerID"SessionField="CustomerID" Type="string"></asp:SessionParameter>
        </SelectParameters>
    </asp:SqlDataSource>
    </div>
    </form>
</body>
Output:

No comments:

Post a Comment

Thank you for visiting my blog

Kubernetes

Prerequisites We assume anyone who wants to understand Kubernetes should have an understating of how the Docker works, how the Docker images...