Need help converting Table to RadGrid (with sortable columns)

4 posts, 0 answers
  1. J
    J avatar
    143 posts
    Member since:
    Jun 2006

    Posted 10 Aug 2011 Link to this post

    I have the following table
    <table>
        <tr>
            <td>First Row, Cell 1</td>
            <td>First Row, Cell 2</td>
        </tr>
        <tr>
            <td colspan="2">Second Row, Cell 1</td>
        </tr>
    </table>

    Can some suggest a RadGrid equivalent that allows me to keep the second row but the cells in the first row become GridBoundColumns?  I think it has to be GridBoundColumn, because this allows sorting by column.

    J
  2. Daniel
    Admin
    Daniel avatar
    4943 posts

    Posted 16 Aug 2011 Link to this post

    Hello J,

    I'm afraid RadGrid does not support such layout.
    Please excuse us for any inconvenience caused.

    Best regards,
    Daniel
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. J
    J avatar
    143 posts
    Member since:
    Jun 2006

    Posted 17 Aug 2011 Link to this post

    Daniel,
    Thanks for your reply.  I took a different approach then I orginally thought of.

    Instead of limiting myself to GridBoundColumns, i kept everything in GridTemplateColumns EXCEPT the column headers. Those I put in their own HTML table but placed them in the HeaderTemplate collection before the ItemTemplate collection.  The ordering of the column header is done by putting the text inside LinkButton. 

    Here is my final product:
    <telerik:RadGrid ID="DocumentGrid1" runat="server" AutoGenerateColumns="false" AllowSorting="True"
                    AllowMultiRowSelection="false" HorizontalAlign="Center" AllowPaging="True" EnableEmbeddedSkins="False"
                    Skin="TDocs" PageSize="7" AllowAutomaticDeletes="false" AllowAutomaticUpdates="false"
                    AllowAutomaticInserts="false" ClientSettings-Selecting-AllowRowSelect="true"
                    AlternatingItemStyle-BackColor="White" ClientSettings-EnableRowHoverStyle="false"
                    OnItemDataBound="DocumentGrid1_ItemDataBound" OnNeedDataSource="DocumentGrid1_NeedDataSource"
                    OnItemCommand="DocumentGrid1_ItemCommand" ToolTip="Please click a row on the grid to perform an action.">
                    <MasterTableView DataKeyNames="????" DataMember="XXXX" HeaderStyle-ForeColor="White"
                        PagerStyle-Mode="NextPrevNumericAndAdvanced">
                        <Columns>
                            <telerik:GridTemplateColumn UniqueName="TemplateColumn" HeaderText="Associated CRMs"
                                HeaderStyle-HorizontalAlign="Center" HeaderStyle-Font-Bold="true">
                                <HeaderTemplate>
                                    <table class="TableCRM" cellpadding="0" cellspacing="0" width="90%">
                                        <tr>
                                            <td width="13%" style="background-color: #CCCCCC; border-right: #000000 1px solid;">
                                                <asp:LinkButton ID="ID" runat="server"
                                                     CommandName="Sort" CommandArgument="ID" 
                                                     Text="CRM ID" OnClick="HeaderSort_Click"
                                                     ></asp:LinkButton>
                                            </td>
                                        </tr>
                                    </table>
                                </HeaderTemplate>
                                <ItemTemplate>
                                <table class="TableCRM" cellpadding="0" cellspacing="0" width="90%">
                                    <tr>
                                        <td width="13%" rowspan="4" align="center" style="border-right: #000000 1px solid;">
                                            <asp:Label ID="lblID" runat="server" CssClass="RowCells"></asp:Label>
                                        </td>
                                    </tr>
                                       </table>
                                </ItemTemplate>
                            </telerik:GridTemplateColumn>
                        </Columns>
                    </MasterTableView>
                    <ClientSettings EnablePostBackOnRowClick="false">
                    </ClientSettings>
                </telerik:RadGrid>
  5. Daniel
    Admin
    Daniel avatar
    4943 posts

    Posted 21 Aug 2011 Link to this post

    Glad to hear you found a suitable way to implement the desired functionality.
    The following links shows how to create multi-row headers which could give you some ideas as to how you can customize your layout further:
    Column Types (notice the last column in the first RadGrid)
    Customizing with GridTemplateColumn

    Kind regards,
    Daniel
    the Telerik team

    Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

Back to Top