diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/01-Overview/Grid_Demo_01_Client_Side_Filtering_Paging_And_Sorting.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/01-Overview/Grid_Demo_01_Client_Side_Filtering_Paging_And_Sorting.razor index 3ab9d627f..75600cffe 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/01-Overview/Grid_Demo_01_Client_Side_Filtering_Paging_And_Sorting.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/01-Overview/Grid_Demo_01_Client_Side_Filtering_Paging_And_Sorting.razor @@ -1,14 +1,14 @@ - + diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Demo_02_Client_Side_Paging.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Demo_01_Client_Side_Paging.razor similarity index 100% rename from BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Demo_02_Client_Side_Paging.razor rename to BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Demo_01_Client_Side_Paging.razor diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Demo_25_Dynamic_Page_Size.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Demo_02_Dynamic_Page_Size.razor similarity index 100% rename from BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Demo_25_Dynamic_Page_Size.razor rename to BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Demo_02_Dynamic_Page_Size.razor diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Demo_26_Page_Size_Selection.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Demo_03_Page_Size_Selection.razor similarity index 100% rename from BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Demo_26_Page_Size_Selection.razor rename to BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Demo_03_Page_Size_Selection.razor diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Demo_34_AutoHide_Paging.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Demo_04_AutoHide_Paging.razor similarity index 100% rename from BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Demo_34_AutoHide_Paging.razor rename to BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Demo_04_AutoHide_Paging.razor diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Demo_05_Dynamic_Pagination.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Demo_05_Dynamic_Pagination.razor new file mode 100644 index 000000000..212c780a7 --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Demo_05_Dynamic_Pagination.razor @@ -0,0 +1,96 @@ +
+ + +
+ + + + + + @context.Id + + + @context.Name + + + @context.Designation + + + @context.DOJ + + + @context.IsActive + + + + + +@code { + Grid grid = default!; + private List? employees = default!; + + private async Task> EmployeesDataProvider(GridDataProviderRequest request) + { + if (employees is null) // pull employees only one time for client-side filtering, sorting, and paging + employees = GetEmployees(); // call a service or an API to pull the employees + + return await Task.FromResult(request.ApplyTo(employees)); + } + + private List GetEmployees() + { + return new List + { + new Employee1 { Id = 107, Name = "Alice", Designation = "AI Engineer", DOJ = new DateOnly(1998, 11, 17), IsActive = true }, + new Employee1 { Id = 103, Name = "Bob", Designation = "Senior DevOps Engineer", DOJ = new DateOnly(1985, 1, 5), IsActive = true }, + new Employee1 { Id = 106, Name = "John", Designation = "Data Engineer", DOJ = new DateOnly(1995, 4, 17), IsActive = true }, + new Employee1 { Id = 104, Name = "Pop", Designation = "Associate Architect", DOJ = new DateOnly(1985, 6, 8), IsActive = false }, + new Employee1 { Id = 105, Name = "Ronald", Designation = "Senior Data Engineer", DOJ = new DateOnly(1991, 8, 23), IsActive = true }, + new Employee1 { Id = 102, Name = "Line", Designation = "Architect", DOJ = new DateOnly(1977, 1, 12), IsActive = true }, + new Employee1 { Id = 101, Name = "Daniel", Designation = "Architect", DOJ = new DateOnly(1977, 1, 12), IsActive = true }, + new Employee1 { Id = 113, Name = "Merlin", Designation = "Senior Consultant", DOJ = new DateOnly(1989, 10, 2), IsActive = true }, + new Employee1 { Id = 117, Name = "Sharna", Designation = "Data Analyst", DOJ = new DateOnly(1994, 5, 12), IsActive = true }, + new Employee1 { Id = 108, Name = "Zayne", Designation = "Data Analyst", DOJ = new DateOnly(1991, 1, 1), IsActive = true }, + new Employee1 { Id = 109, Name = "Isha", Designation = "App Maker", DOJ = new DateOnly(1996, 7, 1), IsActive = true }, + new Employee1 { Id = 111, Name = "Glenda", Designation = "Data Engineer", DOJ = new DateOnly(1994, 1, 12), IsActive = true }, + }; + } + + private async Task AddEmployee() + { + if(employees is null) + employees = new(); + + // for the same employees collection, we are adding an object + // explicit grid refresh required + employees.Add(CreateEmployee()); + await grid.RefreshDataAsync(); + } + + private Employee1 CreateEmployee() + { + var emp = new Employee1(); + emp.Id = (employees?.Any() ?? false) ? employees.Max(x => x.Id) + 1 : 1; + emp.Name = $"Employee {emp.Id}"; + emp.Designation = $"QA Engineer {emp.Id}"; + emp.DOJ = new DateOnly(new Random().Next(1970, 2000), new Random().Next(1, 12), new Random().Next(1, 25)); + emp.IsActive = true; + return emp; + } + + private async Task RemoveEmployee() + { + if (employees!.Count > 0) + employees!.Remove(employees.Last()); + + await grid.RefreshDataAsync(); + } +} \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Paging_Documentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Paging_Documentation.razor index 959fe0faf..db79183fe 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Paging_Documentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Paging_Documentation.razor @@ -15,21 +15,25 @@
For paging, AllowPaging and PageSize parameters are required.
Add AllowPaging="true" and PageSize="20" parameters to the Grid. PageSize parameter is optional.
The default page size is 10. - +
- +
- +
- + +
+ +
+
@code { diff --git a/blazorbootstrap/Components/Grid/Grid.razor.cs b/blazorbootstrap/Components/Grid/Grid.razor.cs index 1fc7b01b2..8d3946c1d 100644 --- a/blazorbootstrap/Components/Grid/Grid.razor.cs +++ b/blazorbootstrap/Components/Grid/Grid.razor.cs @@ -201,6 +201,10 @@ internal async Task RefreshDataAsync(bool firstRender = false, CancellationToken { items = result.Data!.ToList(); totalCount = result.TotalCount ?? result.Data!.Count(); + if (result.PageNumber.HasValue) + { + gridCurrentState = new GridState(result.PageNumber.Value, gridCurrentState.Sorting); + } } else { diff --git a/blazorbootstrap/Models/GridDataProviderRequest.cs b/blazorbootstrap/Models/GridDataProviderRequest.cs index d326c4549..4a5def250 100644 --- a/blazorbootstrap/Models/GridDataProviderRequest.cs +++ b/blazorbootstrap/Models/GridDataProviderRequest.cs @@ -62,13 +62,19 @@ public GridDataProviderResult ApplyTo(IEnumerable data) // apply paging var totalCount = resultData!.Count(); // before paging - if (PageNumber > 0 && PageSize > 0) + int? newPageNumber = null; + if (PageNumber > 0 && PageSize > 0 && totalCount > 0) { int skip = (PageNumber - 1) * PageSize; + if (totalCount <= skip) + { + newPageNumber = (totalCount / PageSize) + (totalCount % PageSize == 0 ? 0 : 1); + skip = (newPageNumber.Value - 1) * PageSize; + } resultData = resultData!.Skip(skip).Take(PageSize); } - return new GridDataProviderResult { Data = resultData, TotalCount = totalCount }; + return new GridDataProviderResult { Data = resultData, TotalCount = totalCount, PageNumber = newPageNumber }; } #endregion diff --git a/blazorbootstrap/Models/GridDataProviderResult.cs b/blazorbootstrap/Models/GridDataProviderResult.cs index d0cb91654..1d60b61f4 100644 --- a/blazorbootstrap/Models/GridDataProviderResult.cs +++ b/blazorbootstrap/Models/GridDataProviderResult.cs @@ -20,5 +20,13 @@ public class GridDataProviderResult /// public int? TotalCount { get; init; } + /// + /// Updates the page number of the grid, if not null. + /// + /// + /// Default value is null. + /// + public int? PageNumber { get; init; } + #endregion }