Treeview remote data with UrlAdaptor

[Unknown]

Hello

I am using ASP.NET CORE EJ 2 version 16.1.0.37 (nuget package).

I am having a bit of trouble implementing the remote data for the Treeview when using the UrlAdaptor.

Let's assume I would like to display a Treeview that has 3 levels and shows the years, months and days of a year.

On the initial load the Treeview should display only the years.

When expanding a year, the months for this year should be loaded (if there are any).

When expanding a month, the days for this month should be loaded (if there are any).

So this means once the Treeview is initially loaded it displays a list of years.

However, the Treeview does not know if the parent has children or not. When clicking the expand button of the parent, a request needs to be sent to the server to query for possible children.

When I try to do something like this, the parents do not have an expand button and thus no query for the children can be made.

Could you please provide an example of a Treeview that uses remote data with the UrlAdaptor, has 3 levels (years, months, days) and the children/subchildren are only loaded when expanding the parent (if there are any children at all)?

Kind regards

Phil

[Piramanayagam Ramakrishnan]

Hi Phil, 

 

Thanks for contacting Syncfusion support. 

 

TreeView has load on demand (Lazy load) concept by default. It loads first level nodes initially, and when parent node expand icon is clicked, loads the child nodes based on the parentID/child member.  

 

To achieve your requirement (the parents do not have an expand button) you have to map HasChildren fields to check whether a node has child nodes or not in TreeView. It will render the TreeView with expand icon. If you don’t know to child details for parent nodes, then set all parent nodes HasChildren fields as true. Please refer to below code example. 

 

[cshtml] 

 

@Html.EJS().TreeView("myTreeviewId").Fields(fields => 

    fields.Id("nodeId").Text("nodeText").ParentID("pid").HasChildren("hasChild") 

    .DataSource(da => da.Url("/Demo/Data").Adaptor("UrlAdaptor").CrossDomain(true)) 

).Render() 

 

 

For your reference, we have prepared a sample based on this and it can be downloaded from the location: Sample 

 

Please refer to below help document to know more about TreeView component. 

https://ej2.syncfusion.com/16.1.37/aspnet/documentation/treeview/getting-started.html?syntax=tag 

 

Please let us know whether the provided sample is helpful in achieving your requirement. If not, revert with more information to proceed further. 

 

Regards, 

Piramanayagam R 

[Unknown]

Thank you so much for your reply.

I was missing the hasChildren field and setting all the hasChild properties to true in the parent object.

Now everything works as expected.

[Piramanayagam Ramakrishnan]

Hi Phil, 

 

We glad to know that, reported requirement is achieved in TreeView component. Please let us know further assistance on this. 

 

Regards, 

Piramanayagam R