Standalone fixed Field List and Virtual Scrolling

Opting out of the built-in field list dialog, we're trying to implement a field list beside the table. We're also dealing with large datasets so we previously needed virtual scrolling which worked great. However, it seems the two don't work great together. When manipulating fields in the field list, and then expanding or collapsing rows in the pivot table, the data just gets lost.
Image_6905_1713401093945

Note that I've followed the minimum steps to implement the static field list along with the pivot table. Then tried the dedicated field list section under Virtual Scrolling - and it still did not work. The example in StackBlitz there exhibits and reproduces the same issue while the preview in site does not.


2 Replies

AP AngelinFaithSheeba PaulvannanRajadurai Syncfusion Team April 18, 2024 12:56 PM UTC

Hi John,


Sorry for the inconvenience. The reported issue occurs because of the “pivotGridModule” not updated properly in the provided code example. Please refer the below updated code example.


Code example:

function onLoad() {

        //Getting component instance.

        pivotObj = document.getElementById('PivotView').ej2_instances[0];

        fieldListObj = document.getElementById('PivotFieldList').ej2_instances[0];

        fieldListObj.pivotGridModule = pivotObj;

        //Assigning report to pivot table component.

        pivotObj.dataSourceSettings = fieldListObj.dataSourceSettings;

        //Generating page settings based on pivot table component’s size.

        pivotObj.updatePageSettings(true);

        //Assigning page settings to field list component.

        fieldListObj.pageSettings = pivotObj.pageSettings;

    }


Meanwhile, we have prepared a sample with the updated code example for your reference.


Sample: https://stackblitz.com/edit/react-bli3eq-v723wj?file=index.js


Furthermore, we will update the samples in our UG documentation to work properly and we will notify you once it's refreshed in live. We appreciate your patience until then.


Regards,

Angelin Faith Sheeba.



AP AngelinFaithSheeba PaulvannanRajadurai Syncfusion Team May 10, 2024 07:19 AM UTC

Hi John,


Thanks for your patience. We have updated the code example in our react documentation under the “Virtual scrolling for static field list” topic, which has now been refreshed in live. For your reference, we have shared the documentation link below.


https://ej2.syncfusion.com/react/documentation/pivotview/virtual-scrolling#virtual-scrolling-for-static-field-list


Regards,

Angelin Faith Sheeba.


Loader.
Up arrow icon