[Solved] Grid heaser with 2 rows

[pradeep k]

Hi all,

I have 20 columns in grid, i wanted to show header in 2 rows (10 columns,10 columns) and also it should support grouping and sorting, please tell me any possible ways to do this,  it is very urgent for me, please save me, help me regarding this.

[Shinu]

Hi Pradeep K,

This is achievable by using GridTemplateColumns with HTML tables in the HeaderTemplate/ItemTemplate. Here is the example shown how to customize GridTemplateColumn.

ASPX:

    . . .
 <telerik:GridTemplateColumn>
        <HeaderTemplate>
            <table id="Table1" cellspacing="1" cellpadding="1" width="100">
                <tr>
                    <td align="center">
                        <b>CustomerID</b>
                    </td>
                </tr>
                <tr>
                    <td align="center">
                        <b>CompanyName</b>
                    </td>
                </tr>
            </table>
        </HeaderTemplate>
        <ItemTemplate>
            <table id="Table2" width="100">
                <tr>
                    <%# DataBinder.Eval(Container.DataItem, "CustomerID")%>
                </tr>
                <tr>
                    <%# DataBinder.Eval(Container.DataItem, "CompanyName")%>
                </tr>
            </table>
        </ItemTemplate>
    </telerik:GridTemplateColumn>
    <telerik:GridTemplateColumn>
        <HeaderTemplate>
            <table id="Table1" cellspacing="1" cellpadding="1" width="100">
                <tr>
                    <td align="center">
                        <b>ContactName</b>
                    </td>
                </tr>
                <tr>
                    <td align="center">
                        <b>ContactTitle</b>
                    </td>
                </tr>
            </table>
        </HeaderTemplate>
        <ItemTemplate>
            <table id="Table2" width="100px">
                <tr>
                    <%# DataBinder.Eval(Container.DataItem, "ContactName")%>
                </tr>
                <tr>
                    <%# DataBinder.Eval(Container.DataItem, "ContactTitle")%>
                </tr>
            </table>
        </ItemTemplate>
    </telerik:GridTemplateColumn>
     . . .

Also checkout the documentation for more information about Customizing with GridTemplateColumn

-Shinu.

[pradeep k]

thank u for the reply, but i want to achieve grouping and sorting as well, how can i do it in this case.

[Pavlina]

Hello Pradeep,

In order to achieve your goal, please check out these links:
Column Types(see the last column in the grid and the buttons inside its header template)
Individual filtering and sorting for "sub-columns" in template column 

I hope this helps.

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.

[pradeep k]

thank u very much.

i will try out one sample to achieve my goal by using the suggestions you gave me, if nay doubts i will get back to you.