How to set default paging to show all rows

[Alex]

Hi,

How to set paging to false and display all the rows returned in a single page?  Also can we sum up the values of each row?

Thanks

[Vignesh Natarajan]

Hi Alex, 

Thanks for contacting Syncfusion support.  

Query: “How to set paging to false and display all the rows returned in a single page?” 

 

In DataGrid, pager will be shown when AllowPaging property is define as true in Grid. If you want to disable paging and render all records in single page, We suggest you to remove the AllowPaging property from Grid or define it as false. Refer the below code example  

<SfGrid DataSource="@Orders">            <GridColumns>        <GridColumn Field=@nameof(Order.OrderID) HeaderText="Order ID" TextAlign="TextAlign.Right" Width="120"></GridColumn>        <GridColumn Field=@nameof(Order.CustomerID) HeaderText="Customer Name" Width="150"></GridColumn>        <GridColumn Field=@nameof(Order.OrderDate) HeaderText=" Order Date" Format="d" Type="ColumnType.Date" TextAlign="TextAlign.Right" Width="130"></GridColumn>        <GridColumn Field=@nameof(Order.Freight) HeaderText="Freight" Format="C2" TextAlign="TextAlign.Right" Width="120"></GridColumn>    </GridColumns></SfGrid>

Since your are disabling the Paging in Grid, if you want to show vertical scrollbar to view the records at botton you can use scrolling feature of Grid. Refer the below documentation for your reference  

https://blazor.syncfusion.com/documentation/datagrid/scrolling/ 

Query: “Also can we sum up the values of each row?” 

From your query we suspect that you want to display summary at the bottom of the Grid. We suggest you to achieve your requirement using Aggregate feature of Grid. Refer the below code example. 

<SfGrid DataSource="@Orders">     

    <GridAggregates> 

        <GridAggregate> 

            <GridAggregateColumns> 

                <GridAggregateColumn Field=@nameof(Order.Freight) Type="AggregateType.Sum" Format="C2"> 

                    <FooterTemplate> 

                        @{ 

                            var aggregate = (context as AggregateTemplateContext); 

                            <div> 

                                <p>Sum: @aggregate.Sum</p> 

                            </div> 

                        } 

                    </FooterTemplate> 

                </GridAggregateColumn> 

            </GridAggregateColumns> 

        </GridAggregate>         

    </GridAggregates> 

    <GridColumns> 

        <GridColumn Field=@nameof(Order.OrderID) HeaderText="Order ID" TextAlign="TextAlign.Right" Width="120"></GridColumn> 

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

        <GridColumn Field=@nameof(Order.OrderDate) HeaderText=" Order Date" Format="d" Type="ColumnType.Date" TextAlign="TextAlign.Right" Width="130"></GridColumn> 

        <GridColumn Field=@nameof(Order.Freight) HeaderText="Freight" Format="C2" TextAlign="TextAlign.Right" Width="120"></GridColumn> 

    </GridColumns> 

</SfGrid> 

For your convenience  we have prepared a sample which can be downloaded from below  

Sample:  https://www.syncfusion.com/downloads/support/forum/154912/ze/BlazorApp1-2073733964  

Refer our UG documentation for your reference 

https://blazor.syncfusion.com/documentation/datagrid/aggregates/#footer-aggregate 

https://blazor.syncfusion.com/documentation/datagrid/aggregates/#built-in-aggregate-types  

Kindly get back to us if you have further queries.  

Regards,
Vignesh Natarajan