Attach stored grid to cell in layout

Suite and Optimus Suite 5
#1

I have a javascript variable where i hold a grid. This grid is initialy created as a …cells(“b”).attachGrid() call. I then toggle view of this cell to be a graph and detach the grid from the layout cell and attach the graph html element. Now i want to switch the graph out for the grid again and there is no way for me to just say:

mygrid = //grid created before but now not attached to the layout layout.cells("b").detachObject(); layout.cells("b").attachObject(mygrid);//throws an error /* Node cannot be inserted at the specified point in the hierarchy" code: "3 */

I think this post make sense but please ask if there is anything thats not clear.

#2

Hello,

attachObject requires html container as parameter. Therefore, it is impossible to use:
layout.cells(“b”).attachObject(mygrid);

detachObject returns a dhtmlx component and its container. Therefore, you may use the following:

var arr = layout.cells(“b”).detachObject();
if(arr.length)
layout.cells(“b”).attachObject(arr[1]);

However, in this case the handlers that resizes grid when layout cell is resized won’t be preserved.
To enable them you may use the following:
layout.cells(“b”).vs[“def”].grid = mygrid;

So, the complete approach:

var arr = layout.cells("b").detachObject(); if(arr.length){ layout.cells("b").attachObject(arr[1]); layout.cells("b").vs["def"].grid = mygrid; }

Also you may use views instead - please read about them in the documentation:

docs.dhtmlx.com/doku.php?id=dhtm … yout_views

#3

Wow, I REALLY like this functionality. Great work!

One tweak I would like is the ability to keep a menu attached to the top of the cell and have all views inherit the menu

|-------Menu------| |-------Menu------|
| | | |
| Content Area 1 | | Content Area 2 |
| ______________| | ______________|

Right now if you attack a menu then change view this happens

|-------Menu------| | |
| | | |
| Content Area 1 | | Content Area 2 |
| ______________| | ______________|

I Solved this issue for now by attaching the Menu then attaching a 1C layout and using the 1C layout for the content area.

Thanks again Alexandra!

#4

Well that formatting in my little image didn’t come out right but I think the point is evident.

#5

this sample
dhtmlx.com/docs/products/dht … _grid.html

move grid from “a” to “b”, move from “b” to “c”
add code

<button onclick="detachGrid();">attach</button>

function detachGrid( ){
	var gr = dhxLayout.cells("a").detachObject();
	dhxLayout.cells("b").attachObject(gr[1]);
	dhxLayout.cells("b").vs["def"].grid = dhxGrid;

	gr = dhxLayout.cells("b").detachObject(); 
	dhxLayout.cells("c").attachObject(gr[1]);
	dhxLayout.cells("c").vs["def"].grid = dhxGrid;
}

2-nd detachObject not work - “Error: Type mismatch.”

#6

use dhtmlx suite 3.0 Pro

#7

Hello, nburnsPF
To avoid menu disappearing you can attach menu as global item in layout:
dhtmlx.com/docs/products/dht … _menu.html
Hello, junb1
If i understood you right, you can try method “moveContentTo”
Like the next: dhxLayout1.cells(“a”).moveContentTo(dhxLayout2.cells(“a”));
to move grid from cell A to cell B

#8

Thanks

#9

You are welcome!