We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

How to display a hierarchical structure with different classes on each level

Hi

I have a need for displaying, and to some extend performing CRUD operations on a data structure similar to: Customer – Sales Invoices – Sales Invoice Lines – Sale Invoice Line Details or Teacher – Class – Students - Grades.

The need for CRUD operations are not present on all levels, but let’s say on the Sales Invoice and Sale Invoice Line Details levels.

I would like to show data in a hierarchical structure with each level indented under the upper level. This is possible to do in a tree grid, but I’m unsure if the tree grid can handle different types of classes or if all levels must bee of the same class. I’m unable to find anything useful information about this.

A data grid can achieve the structure by grouping of data, but I don’t like this approach as the hierarchy is static, and a grouping can be altered by the user. This would mess up the easy overview I’m trying to achieve.

My questions are:

1.
Is it possible to achieve my display needs with a hierarchical structure of different classes in the same grid e.g. a tree grid, data grid or some other control I haven’t mentioned?

2.
And if so, how?

Regards

Morten

1 Reply

JS Jonesherine Stephen Syncfusion Team October 18, 2016 12:20 PM UTC

Hi Morten, 
Thanks for contacting Syncfusion support. 
We can achieve this requirement by using Grid. As you have mentioned different class to bind the Hierarchical structure grid. From this, we have a Hierarchical grid feature to bound the Grid with different children with different data source. Please refer to the below code example,  
<GRID>  
//Here we bound the hierarchical grid with different model classes  
@(Html.EJ().Grid<HierachyGrid.Controllers.EmployeeView>("HierarchyGrid")   
        .Datasource((IEnumerable<object>)ViewBag.datasource)   
        .Columns(col =>  
        {  
. . .  
        })  
                 .ChildGrid<HierachyGrid.Controllers.Orders>(child =>  
                 {  
                     child.Datasource((IEnumerable<object>)ViewBag.childDataSource1)  
                        .QueryString("EmployeeID")  
                        .AllowPaging()  
                        .Columns(col =>  
                        {  
                            . . .  
                        })  
                        .ChildGrid<HierachyGrid.Controllers.Customer>(d =>  
                        {  
                            d.Datasource((IEnumerable<object>)ViewBag.child2DataSource2)  
                           .QueryString("CustomerID")  
                           .Columns(col =>  
                           {  
  .  
                           });  
                        });  
                 })  
  
)   
Please refer to the Help documentation and online Demo for more information,  
 
  
If we misunderstood your query, then could you please share more details about your requirement and also please provide more information about the query “different types of classes or if all levels must be of the same class”.  
Regards,  
Jone sherine P S 


Loader.
Live Chat Icon For mobile
Up arrow icon