Hi Arcblue,
Greetings from Syncfusion support.
Query: “Is it possible to make the grid scroll to the top when a page number is clicked?”
Yes, it is possible. But we will be able to achieve this requirement using only JavaScript function with JSInterop. When navigating between the pages, OnActionComplete event will be triggered with RequestType Paging, here we suggest you to make a call to JavaScript function using JSInterop and scroll through grid by changing the scrollTop value of the grid content.
Kindly check the attached code snippet and sample for your reference.
|
@inject IJSRuntime Runtime
<SfGrid DataSource="@GridData" @ref="Grid" Height="300" Width="100%" AllowPaging="true">
<GridPageSettings PageSize="50"></GridPageSettings>
<GridEvents OnActionComplete="ActionComplete" TValue="Order"></GridEvents>
<GridColumns>
...
</GridColumns>
</SfGrid>
@code{
public List<Order> GridData { get; set; }
public SfGrid<Order> Grid;
public async Task ActionComplete(ActionEventArgs<Order> args)
{
if(args.RequestType == Syncfusion.Blazor.Grids.Action.Paging)
{
await Runtime.InvokeVoidAsync("scroll", Grid.ID);
}
}
...
}
|
Layout.cshtml
|
<head>
<script src="~/Scroll.js"></script>
...
</head> |
Scroll.js
|
function scroll(Id) {
var grid = document.getElementById(Id);
grid.querySelector('.e-content').scrollTop = 0;
} |
Kindly get back to us if you have further queries.
Regards,
Monisha
