Treeview not refreshed after modifying datasource and calling StateHasChanged

[Otmar Ganahl]

I am using the blazor treeview component. The datasource is bounded to a property in the view model. The tree is rendered correctly.

When I modify the datasource in the viewmodel (e.g. add a new item, or remove an item) and calling StateHasChanged the treeview component does not display the new item or remove the item.

The getter (datasource) is called after StateHasChanged.

Is this a bug? Has anybody a solution?

[Kanagambigai Murugan]

Hi Otmar, 

Good day to you. 

We have validated the reported issue, but unfortunately, we could not reproduce it. We suspect that this may be due to the outdated version package or script reference.  Please ensure that you use the latest scripts and NuGet packages (V 17.3.0.10).  

We have prepared a sample for your reference. 

Sample: https://www.syncfusion.com/downloads/support/forum/147809/ze/TreeViewDemo-151016968  

Please check the above sample and if the issue still persists, let us know the following details 

1. Product version, .NET Core version
2. Whether you are using local datasource or data fetched from the remote end using adaptors
3. Share the sample which you tried from your side
4. If possible kindly reproduce the problem with the above-attached sample and share it with us.

Kindly share the above-asked information if the issue still persists. It would be more helpful to assist you better. 

Regards, 

Kanagambigai M. 

 

[Ravi Kishore]

I too have similar kind of issue. If you add node to treeview it is working. But in my case change will be updated to data source not to treeview and that is not refelected to UI.

Attached updated sample.

Attachment: TreeViewDemo_updated_284b72a0.zip

[Muthukrishnan Kandasamy]

Hi Ravi, 

 

Thanks for contacting Syncfusion support. 

 

We have checked your query with your shared sample project. You can simply add the new data to tree view control using AddNodes method. Refer to the below code block. 

 

 

/* Add new nodes */ 

    void AddNodes() 

    { 

        MailItem[] Mail = new MailItem[] { new MailItem { Id = "04-01", FolderName = "New Folder" } }; 

        tree.AddNodes(Mail); 

    } 

 

You have used old version (17.3.0.10-beta) of Syncfusion NuGet package, kindly update your project to new version (17.4.46). 

 

Please let us know if you need any assistance. 

  

  

Regards, 

Muthukrishnan K 

[Yordan]

I have exactly the same issue.

the treeview works extremely slow on webASM, and i have a template with more than 1000 items to load in hierarchical way quite too often. It practically freeze the whole UI.

is there much convenient and faster way do set datasouce and visualize the date in the treeview ?

[Sowmiya Padmanaban]

Hi Yordon,  

 

We have checked your query on performance  problem in TreeView component. When you expanded all the TreeView nodes,  then it will load the 1000 nodes in the approximate of 5 seconds. By default, TreeView component has a lazy loading functionality. By default, TreeView component has LoadOnDemand (Lazy loading).  

 

LoadOnDemand reduces the bandwidth size when consuming huge data. It loads first level nodes initially, and when parent node is expanded, loads the child nodes based on the ParentID/Child member. By default, the LoadOnDemand is set to true. 

 

When you set the loadOnDemand as true and expanded property as false, when initializing TreeView. The parent nodes will be accessed from the server-side and it will gets generated into the DOM. Only when expanding any tree node, its child node will be accessed from the server side and  loaded in DOM. By using this functionalities, you can reduce the performance of TreeView component. 

 

Refer the below link to know more about the loadOnDemand of TreeView component. 

https://blazor.syncfusion.com/documentation/treeview/data-binding/ 

 

Please let us know, if you need any further assistance. 

 

Regards,  

Sowmiya.P