Unplanned
Last Updated: 18 May 2023 15:09 by ADMIN
Andre
Created on: 30 May 2022 12:15
Category: Grid
Type: Bug Report
5
Footer row does not scroll horizontally
The Grid footer row will not scroll horizontally if:
  • the Grid is initially rendered without columns
  • I am using OnInitializedAsync

Here is a runnable REPL test page. A possible workaround is to render the Grid only if it has columns:

@{
    if (GridColumns.Count() > 0)
    {
        <TelerikGrid Data="@Data">
            <GridColumns>
                @foreach (var column in GridColumns)
                    {
                    <GridColumn Field="@column.DataField"
                                ShowColumnMenu="false" Title="@column.DisplayName" Resizable="true" Width="500px">
                        <FooterTemplate>
                            foo
                        </FooterTemplate>
                    </GridColumn>
                    }
            </GridColumns>
        </TelerikGrid>
    }
}
7 comments
ADMIN
Dimo
Posted on: 18 May 2023 15:09

Hello Marat,

My last test page works OK with older version too. So your setup is probably different. For example, the problem occurs when the Grid is  defined with no columns, and the columns are added later. In this case, the footer row is missing a JavaScript scroll handler.

Regards,
Dimo
Progress Telerik

Stay tuned by visiting our public roadmap and feedback portal pages! Or perhaps, if you are new to our Telerik family, check out our getting started resources!
Marat
Posted on: 18 May 2023 14:07

Hello Dimo, 

 

Thank you for the prompt response with a nice demo!

I have checked the REPL test page (demo), and it looks like the bug was fixed recently, as the footer scrolls horizontally together with the rows above on your REPL test page. However, when testing a similar grid with Telerik.UI.for.Blazor(4.1.0) package, the bug is there. Is this fix already available in the latest version of Telerik.UI.for.Blazor packages, or is it still yet to be released?

 

Kind regards,

Marat. 

ADMIN
Dimo
Posted on: 18 May 2023 06:40

Hello Marat,

Here is a REPL test page, which works. Can you described how do you reproduce the non-scrolling footer, if the Grid has columns and data initially?

Regards,
Dimo
Progress Telerik

Stay tuned by visiting our public roadmap and feedback portal pages! Or perhaps, if you are new to our Telerik family, check out our getting started resources!
Marat
Posted on: 18 May 2023 00:24

Hello Andre,

The issue is that there are many columns in a grid, and they do contain data. Therefore, the 'if (GridColumns.Count() > 0)' check does not change anything in this case. A grid has a footer row. When all columns do not fit into a screen's width, the Telerik Blazor grid gets a horizontal scroller. When you scroll left-right, all of the rows of the grid scroll left-right EXCEPT the footer row, which stays sticky. As a result of this, when a user scrolls right, the values in the footer row do not match the values in the columns above, which is extremely misleading for users. 
It's Ok that the footer row is sticky when scrolling vertically; however, it's not Ok when scrolling horizontally - it should scroll horizontally together will all the cells above. 
Can this issue with the sticky Telerik Blazor grid's footer row be fixed? 

Kind regards,
Marat.

ADMIN
Dimo
Posted on: 16 May 2023 08:55

Hello everyone,

The easiest workaround is to render the whole Grid only if there is at least one visible column. The original post contains an example. Just replace

if (true)

with

if (GridColumns.Count() > 0)

Regards,
Dimo
Progress Telerik

Stay tuned by visiting our public roadmap and feedback portal pages! Or perhaps, if you are new to our Telerik family, check out our getting started resources!
Marat
Posted on: 09 May 2023 22:26

Not scrolling horizontally. Is there a solution for this?

 

Martin
Posted on: 26 Jul 2022 09:18
here also not working