Customize Pager DropDown

17 Feb 20221 minute to read

To customize default values of pager dropdown, you need to define pageSizes as array of strings.

CSHTML

<ejs-grid id="Grid" dataSource="@ViewBag.DataSource" allowPaging="true"> 
<e-grid-pagesettings pageSizes="@(new string[] { "5", "10" , "All" })"></e-grid-pagesettings>
    <e-grid-columns>
        <e-grid-column field="OrderID" headerText="Order ID" textAlign="Right" width="120"></e-grid-column>
        <e-grid-column field="CustomerID" headerText="Customer ID" width="150"></e-grid-column>
        <e-grid-column field="ShipCity" headerText="Ship City" width="150"></e-grid-column>
        <e-grid-column field="ShipName" headerText="Ship Name" width="150"></e-grid-column>
    </e-grid-columns>
</ejs-grid>

Pagerdropdown.cs

public IActionResult Index()
{
    ViewBag.DataSource = OrderDetails.GetAllRecords();
    return View();
}