DHTMLX Components Integration

dhtmlxAccordion is compatible with the following dhtmlx Components:

dhtmlxGrid/TreeGrid;
dhtmlxTree;
dhtmlxTabbar;
dhtmlxFolders;
dhtmlxLayout;
dhtmlxMenu;
dhtmlxToolbar;
dhtmlxEditor.

Also a simple Status Bar can be attached to any Accordion's item.

To implement attaching you need to do the following:

Download the necessary package from the server and place it in a folder.
Include related js and css files into the <head> tag of your html file .

The files to which the paths need to be specified should be checked in the documentation describing work with the corresponding component. Any of the mentioned above components can be easily attached to an Accordion item:

   var grid = dhxAccord.cells("a1").attachGrid();
   // or
   var tree = dhxAccord.cells("a1").attachTree();
   // or
   var treeGrid = dhxAccord.cells("a1").attachGrid();
   // or
   var folders = dhxAccord.cells("a1").attachFolders();
   // or
   var tabbar = dhxAccord.cells("a1").attachTabbar();
   // or
   var layout = dhxAccord.cells("a1").attachLayout("3L");
   // or
   var menu = dhxAccord.cells("a1").attachMenu();
   // or
   var tollbar = dhxAccord.cells("a1").attachToolbar();  
   // or
   var editor = dhxAccord.cells("a1").attachEditor();
   // or
   var statusBar = dhxAccord.cells("a1").attachStatusBar();

The attach[Component]() method doesn't take any input parameters for each Accordion compatible component except for dhtmlxLayout and dhtmlxTree.

The only input parameter should be indicated for attachLayout() method - Layout's pattern type.

There is the only input parameter for the attachTree() method - the id of a virtual super item that is the parent to all the top level tree nodes of the added dhtmlxTree (see dhtmlxTree constructor description for details). If the super root element id is 0, this parameter can be omitted.

Please note, if you want to attach dhtmlxGrid with paging to the dhtmlxAccordion cell you should use the attachObject() method to attach container with grid and paging area:

dhxAccordion.cells("a").attachObject("paging_container");