Paging problem in SfGrid

Hello,


I am developing a Blazor project with .Net core 8. I started using syncfusion for the first time. But I encountered a problem.


I'm having trouble paginating.


Pagination works just fine when I use it as follows.

pagination1.png

 <SfGrid DataSource="@Orders" @ref="DefaultGrid">

     <GridColumns>

         <GridColumn Field=@nameof(CompanyDto.Name) HeaderText="Order ID" Width="120"></GridColumn>

         <GridColumn Field=@nameof(CompanyDto.Description) HeaderText="Customer Name" Width="150"></GridColumn>

     </GridColumns>

 </SfGrid>

 <Syncfusion.Blazor.Navigations.SfPager PageSize="3" TotalItemsCount="companyModel.totalCount" />



But when I want to do it as follows, as in the syncfusion documents, pagination does not work.

pagination2.png



     <SfGrid DataSource="@Orders" @ref="DefaultGrid" AllowPaging="true" Pa>

         <GridPageSettings PageCount="25" PageSize="3"></GridPageSettings>

         <GridColumns>

             <GridColumn Field=@nameof(CompanyDto.Name) HeaderText="Order ID" Width="120"></GridColumn>

             <GridColumn Field=@nameof(CompanyDto.Description) HeaderText="Customer Name" Width="150"></GridColumn>

         </GridColumns>

     </SfGrid>


I have a json object like below.

{
    "data": [
        {
            "id": 8,
            "name": "Test 1",
            "createdDate": "2023-12-12T17:08:46.8833543"
        },
        {
            "id": 9,
            "name": "Test 10",
            "createdDate": "2023-12-12T17:08:55.5490687"
        },
        {
            "id": 12,
            "name": "Test 11",
            "createdDate": "2023-12-12T17:09:07.5325074"
        }
    ],
    "currentPage": 1,
    "totalPages": 4,
    "totalCount": 12,
    "pageSize": 3,
    "hasPreviousPage": false,
    "hasNextPage": true,
    "succeeded": true,
    "code": 0
}







1 Reply

SP Sarveswaran Palani Syncfusion Team January 10, 2024 03:48 AM UTC

Hi Fatih,

Greetings from Syncfusion support.

Based on your query, it seems you're encountering issues with the inbuilt pager and pager component. The pagesize property determines the number of records displayed per page. In your provided Pager component sample, you've passed 12 records, resulting in the display of 4 pages in the UI. This is the actual behavior of the component. We have prepared sample in latest version on .Net 8 framework. Kindly refer the attached sample for your reference.

Reference: https://blazor.syncfusion.com/documentation/datagrid/paging
               https://blazor.syncfusion.com/documentation/datagrid/paging#how-to-render-pager-at-the-top-of-the-grid  


If still issue reproduce or we misunderstood your query, we request you to share more details about your requirement with video demo of an issue and issue reproducible sample to us or reproduce a reported issue in the provided sample. It’ll be more helpful to further validate the query and provide precise solution ASAP from our end.

Regards,
Sarvesh


Attachment: SfGridNet8_1a23a078.zip

Loader.
Up arrow icon