The premise
I'm working on a Blazor project with VS Community 17.14.25.
I'm trying to tie a Pagination Bar to a table: upon clicking a button on this Bar, the table should display the corresponding page; behind the scenes, it's getting a new segment of entries via pagination (I'm positive the APIs are not the problem).
What isn't working
Clicking on a Bar element does nothing. The first PaginationBar.razor function is seemingly triggered, but to no eventual success.
I've tried changing signatures, forcing a StateHasChanged() and clean rebuilds, but nothing did the trick.
The code
Here's a sample PaginationBar.razor button:
<li class="page-item" @onclick:preventDefault><a class="page-link" @onclick="() => UpdateCurrentPage(CurrentPage + 1)"><i class="bi bi-caret-right-fill"></i></a></li>Here's the @code section of PaginationBar.razor:
@code { [Parameter] public int CurrentPage { get; set; } [Parameter] public int TotalPages { get; set; } [Parameter] public EventCallback<int> OnCurrentPageUpdated { get; set; } private async Task UpdateCurrentPage(int newPage) { // Validation via HTML await OnCurrentPageUpdated.InvokeAsync(newPage); }}Here's how I included PaginationBar.razor in Index:
<PaginationBar CurrentPage="@CompanyQueryResult.PageNumber" TotalPages="@CompanyQueryResult.TotalPages" OnCurrentPageUpdated="UpdateCurrentPage"></PaginationBar>And here's how I'm handling the EventCallback on the Index.Razor component:
public async Task UpdateCurrentPage(int newPage){ Filters.PageNumber = newPage; CompanyQueryResult = await _service.GetCompaniesAsync(Filters); StateHasChanged();}