Repeat headers in radgrid master/detail tables

8 posts, 0 answers
  1. ToltingColtAcres
    ToltingColtAcres avatar
    83 posts
    Member since:
    Nov 2010

    Posted 02 Jan Link to this post

    Is there an easy way to repeat headers for each record in a radgrid master/detail table?

    In records with a lot of children, the headers can scroll off the screen, and then the user has to scroll up and down to read the headers. It would be nice if there were a way to automatically repeat the header each time you write a new MasterHeader, for instance, since RadGrid doesn't have a "freeze" feature where the headers will remain frozen at the top of the screen while the user scrolls down.

    Is there an easy way to do this?

    MasterHeader
    MasterDetail
    ChildHeader
    ChildDetail
    ChildHeader
    ChildDetail
    ChildHeader
    ChildDetail
    MasterHeader
    MasterDetail

  2. Marin
    Admin
    Marin avatar
    1044 posts

    Posted 06 Jan Link to this post

    Hi,

    Currently RadGrid does not support frozen headers for the detail tables. But you can enable this on the MasterTableView by setting: ClientSettings-Scrolling-UseStaticHeaders="true".
    This way when you scroll the content the headers of the master table view will always be visible. Online demo of this feature is also available here:
    http://demos.telerik.com/aspnet-ajax/grid/examples/functionality/scrolling/scrolling/defaultcs.aspx

    Regards,
    Marin
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. ToltingColtAcres
    ToltingColtAcres avatar
    83 posts
    Member since:
    Nov 2010

    Posted 19 Apr Link to this post

    Well, I'm not looking for a mechanism to freeze the headers, simply repeat the header each time a detail record is written.

    I'm dealing with a three-tier grid (grandparent-parent-child) which may have 1000's of records, with hundreds of parents containing dozens of children... so the headers routinely scroll off the screen, especially on the "parent" level, and definitely on the "grandparent" level.
  5. Marin
    Admin
    Marin avatar
    1044 posts

    Posted 19 Apr Link to this post

    Hi,

    The static headers of the grid that I mentioned before will keep the header of the top most level of the hierarchy always visible as shown in the demo. However the grid does not support this static headers feature for the inner levels.
    Each detail table consists of its own header followed by its own data records. There isn't any place where additional headers from upper levels can be displayed here without breaking the hierarchical layout.
    The grid supports expand / collapse feature so if all upper levels are collapsed and the current expanded child table scrolled into view then the grandparent headers will be visible right above the child table headers.
    The grid also supports multicolumn headers if you wish to group the headers under additional headers for providing more information.

    Regards,
    Marin
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
  6. ToltingColtAcres
    ToltingColtAcres avatar
    83 posts
    Member since:
    Nov 2010

    Posted 19 Apr in reply to Marin Link to this post

    Thanks for the follow-up.

    The expand/collapse feature is not something the user wants, they find it more confusing and prone to skipping over data, and "the boss" wants each record reviewed and verified. The multicolumn header feature with a static header might work, but, unfortunately, the column widths don't really line up with the amount of screen real estate I'm dealing with. If there were a way for me to build a static header "by hand" where I could replicate the column widths shown, that would probably work.

    Really what I was hoping to accomplish was to simply repeat the "Accounting ID" and "Contract #" headers for each and every accounting or contract record generated. E.g. I was hoping there was a line level "pre-render" event I could intercept where I could insert a header or "fake" header" line into the grid to replicate the effect I was hoping for.

    This grid is populated with hundreds of "accounting Id" level records, and there are oftentimes dozens of "contract"-level records under each "accounting" level, and then potentially dozens of "line number"-level records under each "contract"... so the headers are quickly lost... and when you get half-way through a group of records, you can lose site of which column is which. The user has to then scroll up, oftentimes dozens of pages, to find the headers and then scroll back down again. With the amount of data displayed (all of which is necessary), the screen gets busy and confusing.

    (the data on this grid is a sample I populated, so while the "line number" looks under populated in size, it really isn't... that column routinely contains a full set of data... most of the columns are sized to their minimum size to reliably display production data without wrapping.)

  7. ToltingColtAcres
    ToltingColtAcres avatar
    83 posts
    Member since:
    Nov 2010

    Posted 19 Apr in reply to ToltingColtAcres Link to this post

    or, to get a little fancy with paint this morning, something that looks like this:
  8. Marin
    Admin
    Marin avatar
    1044 posts

    Posted 22 Apr Link to this post

    Hi,

    The headers are designed to stand only in the tHead part of the grid's table, that's why they have different rendering and styling applicable only to the head and cannot be replicated in the data part of the grid's table, because their rendering will not fit there. They have <th> elements for header cells and the grid's data table requires <td> elements for the data cells.
    Again by design each row of the grid must be related to a data record from the data source. That's why the control cannot render additional rows or headers on demand.
    The grid's template column allows you define the layout and style of each cell in that column - using <ItemTemplate> and <HeaderTemplate>. This can be used to have the data in the bottom part of the cell and an additional information such as "Account ID" or "Contact#" in the top part
    <telerik:GridTemplateColumn>
         <ItemTemplate>
             <div>AccountID ot Contact#</div>
             <div><asp:Label Text='<%# Bind("SomeDataField") %>' runat="server" ID="Label1" /></div>
         </ItemTemplate>
    </telerik:GridTemplateColumn>


    Regards,
    Marin
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
  9. ToltingColtAcres
    ToltingColtAcres avatar
    83 posts
    Member since:
    Nov 2010

    Posted 22 Apr in reply to Marin Link to this post

    Thanks. I ended up using a similar approach using <ItemTemplate> within <MasterTableView> after my <columns> definitions. Effectively the same result, although I must admit it does not look as "clean" as using the grid controls' headers. 
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017