Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Loading grid animation #598

fmdo83 started this conversation in General
Mar 4, 2024 · 4 comments · 3 replies
Discussion options

Hi, I would like to know if there is any way to show some kind of loading spinner when the GRID is populating on pagination click.
I am developing an application and every time I click on a new page, the data is retrived from the server.
I am using the GridDataProvider to achive this with PageNumer and PageSize.
Thank you very much.

You must be logged in to vote

Replies: 4 comments 3 replies

Comment options

I cant make it work like in the DEMO page, with the GRID placeholder animation.
The GRID render when the data is loaded. One I click on the second page for example, the animation doesnt start.
Thanks for any help.

You must be logged in to vote
1 reply
Comment options

@fmdo83 Thank you for trying the BlazorBootstrap. Can you share the screen recording for better understanding?

Comment options

If I use a Modal and call modal?.HideAsync inside the GridDataProvider, the animation (placeholder inside the GRID) works OK.
What I am missing?
Thx

private async Task<GridDataProviderResult> CustomersDataProvider(GridDataProviderRequest request)
{
await modal?.HideAsync();
string sortString = "";
BlazorBootstrap.SortDirection sortDirection = BlazorBootstrap.SortDirection.None;

if (request.Sorting is not null && request.Sorting.Any())
{
 sortString = request.Sorting.FirstOrDefault()!.SortString;
 sortDirection = request.Sorting.FirstOrDefault()!.SortDirection;
}
var resultTask = await _customerService.GetProductosGrid(request.PageNumber, request.PageSize);
return await Task.FromResult(new GridDataProviderResult<string> { Data = resultTask.Item1, TotalCount = resultTask.Item2 });

}

You must be logged in to vote
0 replies
Comment options

screen-capture.1.webm
You must be logged in to vote
2 replies
Comment options

Hi Vikram.
1 - The GRID render when the data is loaded from the server (I have a thread sleep to simulate low query).
2 - One time the GRID is rendered and I click on PAGE 2, the data is retrieved from server (same as point 1), but no placeholder animation.
3 - If I use modal?.HideAsync(); inside the CustomersDataProvider, the effect works ok. So I guess that I am missing something.
The idea is that the GRID show always the placeholder when CustomersDataProvider is fetching the data (When I make the firstrender and when I click on the pagination button.

Comment options

@fmdo83
Thank you for taking the time to share the screen recording. I understand the issue now. We will include an update in the next release.

Comment options

Is there already something new?

Best regards

You must be logged in to vote
0 replies
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet

AltStyle によって変換されたページ (->オリジナル) /