Attach AutoHeight Grids to Multimode Accordion

Suite and Optimus Suite 5
#1

Trying to get the right fit but can’t seem to find the way which works.

Would like to attach several AutoHeight grids to a Multimode Accordion.

So things expand and collapse without preallocated heights. So user sees everything collapsed and then can expand any item, several, or all items.

Does that sound like the best way to hide grids?

Any help would be appriciated.

Mike

#2

multimode accordion allows to show several items at once. However, auto height of the grid won’t affect accordion item. The accordion item has fixed size. You may change it using setHeight method:

dhxAccord.cells(“a1”).setHeight(400);

If you want to change the size of accordion item based on grid size, you may call the following:

var grid = dhxAccord.cells(“a1”).attachGrid();
…
grid.loadXML(url,function(){
dhxAccord.cells(“a1”).setHeight(grid.entBox.offsetHeight+30);
});

#3

Got it, thank you, that was a big help.

Mike

#4

Ok to ask,

What is the best way to reload any of the grids later, after initialzed?

This works on first load but not for reload.

Reload seems to work if the Accordion item is left open, but if it is closed afterwards, it locks closed.

I’ve been every time using…

var grid = dhxAccord.cells(“a1”).attachGrid();
…
grid1.loadXML(url,function(){
dhxAccord.cells(“a1”).setHeight(grid.entBox.offsetHeight+30);
dhxAccord.closeItem(“a1”);
});

and tried simply…

grid1.clearAndLoad(url,function(){
dhxAccord.cells(“a1”).setHeight(grid.entBox.offsetHeight+30);
dhxAccord.closeItem(“a1”);
});

Is there a way to access the Grid object from the Accordion object instead of keeping global var grid1?

I have really tried finding the answers on my own. Thank you for your help.

  • Mike
#5

You should set the size of accordion cell only when it’s open:

grid1.loadXML(url,function(){ dhxAccord.closeItem("a1"); }); dhxAccord.attachEvent("onBeforeActive",function(id){ if(id=="a1") window.setTimeout(function(){ dhxAccord.cells("a1").setHeight(grid1.entBox.scrollHeight+30) },1); return true })

#6

I get it,

Again thank you very much.

Mike