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.
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to expand 3 levels Hierarchical grid

Thread ID:

Created:

Updated:

Platform:

Replies:

125968 Sep 14,2016 02:25 PM UTC Sep 22,2016 05:17 AM UTC JavaScript 5
loading
Tags: ejGrid
Ignacio
Asked On September 14, 2016 02:25 PM UTC

Hi,
I'm using a Hierarchical grid with 3 levels (2 child grids one inside the other). I want to expand all the grids, I tried with $("#Grid").ejGrid("expandAll")  but it only expand the main grid and the child. What can i do to expand all the grids?

http://jsplayground.syncfusion.com/m3jaa3bv

Thanks!

Seeni Sakthi Kumar Seeni Raj [Syncfusion]
Replied On September 15, 2016 12:36 PM UTC

Hi Ignacio, 

We could see you have called the expandAll method using the parent Grid’s instance (#Grid) which will expand the immediate child Grid of the parent Grid(#Grid) and not its successive Grids. To expand the successive Child Grids , you have to call the expandAll method after rendering the child Grid content i.e. in the dataBound event. Refer to the following code example. 

<div id="Grid"></div> 
 
$(function () { 
    $("#Grid").ejGrid({ 
        dataSource: data, 
        allowSorting: true, 
        dataBound: function(args){ 
            this.expandAll(); 
        }, 
                  . ..  
        childGrid: { 
            dataSource: window.gridData, 
            queryString: "EmployeeID", 
            allowPaging: true, 
            dataBound: function(args){ 
                this.expandAll(); 
            }, 
              . ..  
            childGrid: { 
                dataSource: window.ordersView, 
                queryString: "CustomerID", 
                 . . .  
            }, 
        }, 
    }); 
           
}); 

Refer to the following sample. 


Regards, 
Seeni Sakthi Kumar S. 


Ignacio
Replied On September 15, 2016 03:17 PM UTC

Thanks. It's not working in my case i think because i'm setting the datasourse later, not in the initialization or the begining.
How can i do in that case? for example when the user press a page button (outside the grid). Doing $("#Grid").ejGrid("expandAll") works fine but just for the main grid.

Thanks again!

Jayaprakash Kamaraj [Syncfusion]
Replied On September 16, 2016 09:39 AM UTC

Hi Ignacio, 

To overcome this problem we suggest you to use below code example in button click. Please refer to the below code example and sample. 

<script type="text/javascript"> 
    $("#refresh").click(function () { 
$("#Grid").ejGrid("expandAll")  
var grid = $(".e-grid"); 
 
for(i=1;i<grid.length;i++){ 
var id = grid.eq(i).attr("id"); 
$("#" + id).ejGrid("expandAll")  
} 
    }); 
 
 
</script> 



Regards, 

Jayaprakash K. 


Ignacio
Replied On September 21, 2016 09:08 PM UTC

Perfect!
Thank you very much!!

Seeni Sakthi Kumar Seeni Raj [Syncfusion]
Replied On September 22, 2016 05:17 AM UTC

Hi Ignacio, 

We are glad that your requirement has been achieved. If you require further assistance, please let us know. 

Regards, 
Seeni Sakthi Kumar S. 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;