TreeGrid: dataStateChange is not firing

[Martin Wrodarczyk]

Hello Syncfusion,

we are using TreeGrid to implement a table in our project. We have to call our backend whenever we are filtering, searching or sorting in the table, but the problem is, that the dataStateChange is not getting triggered. Our plan is, that we want to load the "new" data source from the backend after the dataStateChange and set the new data source in the TreeGrid.

Because of performance issues, we have to rely on the following:

• Virtualization has to be enabled (the table may be filled with large data)
• We can not use self referential data, because otherwise the internal mapping in the TreeGrid freezes the UI and takes a long time

We figured out, that the onActionComplete event is triggered after each operation, but then we would have to read private attributes of theTreeGrid. We also had the issue that setting the new data source after onActionComplete would only show "no data available".

We prepared a minimal example for our problem: https://stackblitz.com/edit/angular-gn2r68-fuxsbb

Thanks in advance and best regards,

Martin

[Farveen Sulthana Thameeztheen Basha]

Hi Martin, 

 

Query: dataStateChange is not getting triggered 

 

Based on provided details, you have used the hierarchical Data binding with custom binding feature of the treegrid. This observable binding feature is only applicable for self-referential data binding. 

 

 

Please refer to the below help documentation, 

https://ej2.syncfusion.com/angular/documentation/treegrid/observables/#data-binding 

 

So we suggest to use Self-reference databinding while enabling Custom Binding feature. 

 

Query: we want to load the "new" data source from the backend set the new data source in the TreeGrid. We also had the issue that setting the new data source after onActionComplete would only show "no data available 

Based on your query, we understand you need to dynamically bind the data and data fetch from the back end. We have the documentation about how to change and refresh the datasource and how to fetch data from backend.

Please refer to the below help documentation,

https://ej2.syncfusion.com/angular/documentation/treegrid/data-binding/#binding-with-ajax

https://ej2.syncfusion.com/angular/documentation/treegrid/how-to/refresh-the-data-source/

If the above solution does not meet your requirement, kindly get back to us with the below requested details, 

 

1. Please share the detailed explanation of your requirement
2. Confirm whether if you want change the data source of treegrid after performing filter/ search/ sort operation.
3. Share us a video demo/screenshot of your requirement.
4. Share the complete tree grid code example

 

The provided information will be helpful to provide you response as early as possible.   

Kindly get back to us for further assistance. 

Regards, 

Farveen sulthana T