Nested grid's and some odd behavior...

[Robin]

I have a grid, with a nested grid (exposed via detailInit), which also has a nested grid.
I am having a couple of issues with it.
When expanding the main grid, if I start at the top item, the second and third one won't expand.
If I start at the third one, the second and first one will expand.  If I start at the second one, the first will expand, but the third one won't.

In the inner grid, if I expand the top row, the second row expands, but isn't rendered correctly.  My innermost grid is actually a tabstrip with two div's in it, and each of those divs are a grid.

I've made a sample that re-creates the problems I am seeing at 
http://jsfiddle.net/giltnerj0/e2RfH/

Thank you.

Robin

[Nikolay Rusev]

Hello Robin,

The behavior is caused due to the fact that you are creating element with same id attribute on every detailInit event:

function detailInit(e) {
 $(e.detailCell).append("<div id='childgrid'></div>");
 ....
}

and then selecting all elements with that id inside current document, not current detail row:

function detailInit(e) {
 $(e.detailCell).append("<div id='childgrid'></div>");

 $("#childgrid").kendoGrid({
 ...
}

You should modify the code as follows:

function detailInit(e) {
 $(e.detailCell).append("<div id='childgrid'></div>");

 $("#childgrid",e.detailCell).kendoGrid({
 ...
}

This will search only in current detail cell. Here is the updated fiddle/first level only/ http://jsfiddle.net/e2RfH/7/

All the best,
Nikolay Rusev
the Telerik team

[Robin]

Ah, that makes perfect sense.  Thank you very much. That also took care of that other problem with the tabstrip not being built properly sometimes.