Search results

Virtual Scrolling in ASP.NET Core Pivot Grid control

21 Oct 2021 / 1 minute to read

The virtual scrolling option allows you to load the large amounts of data without performance degradation by rendering rows and columns only in the content viewport. The data will refresh dynamically on vertical or horizontal scroll. This feature can be enabled by setting the enableVirtualization property to true.

Copied to clipboard
<ejs-pivotview id="PivotGrid" height="300" width="800" enableVirtualization="true">
    <e-datasource data="" expandAll="true">        
            <e-field name="Country"></e-field>
            <e-field name="Products"></e-field>
            <e-field name="Year" caption="Production Year"></e-field>
            <e-field name="Quarter"></e-field>
            <e-field name="Sold" caption="Units Sold"></e-field>
            <e-field name="Amount" caption="Sold Amount"></e-field>
Copied to clipboard
public ActionResult Index()
    var data = GetPivotData(); = data;
    return View();

The height and width properties should be set for virtual scrolling. If it is not defined then the pivot grid will consider its value as 300px and 800px respectively.

Limitations for virtual scrolling

  • In virtual scrolling, the column width should be in pixel and percentage values are not accepted.
  • Due to the element height limitation in browsers, the maximum number of records loaded by the pivot grid is limited by the browser capability.