Integrate dhtmlxGrid into dhtmlxTabbar

I’m integrating dhtmlxGrid into my dhtmlxTabbar and loading the content through XML. I had the following questions:

create separate XML files?
If not, how can I identify which tab to load the data?

Below is a snapshot of my code:

<link rel="STYLESHEET" type="text/css" href="../dhtmlx/dhtmlxTabbar/codebase/dhtmlxtabbar.css">
<script src="../dhtmlx/dhtmlxTabbar/codebase/dhtmlxcommon.js" type="text/javascript"></script>
<script src="../dhtmlx/dhtmlxTabbar/codebase/dhtmlxtabbar.js" type="text/javascript"></script>
<script src="../dhtmlx/dhtmlxTabbar/codebase/dhtmlxtabbar_start.js" type="text/javascript"></script>
<script src="../dhtmlx/dhtmlxTabbar/codebase/dhtmlxcontainer.js" type="text/javascript"></script>
<!-- DHTMLX GRID -->
<link rel="STYLESHEET" type="text/css" href="../dhtmlx/dhtmlxGrid/codebase/dhtmlxgrid.css">
<link rel="STYLESHEET" type="text/css" href="../dhtmlx/dhtmlxGrid/codebase/skins/dhtmlxgrid_dhx_blue.css">
<script src="../dhtmlx/dhtmlxGrid/codebase/dhtmlxgrid.js?ver=3.6" type="text/javascript"></script>
<script src="../dhtmlx/dhtmlxGrid/codebase/dhtmlxgridcell.js?ver=3.6" type="text/javascript"></script>
<script src="../dhtmlx/dhtmlxGrid/codebase/dhtmlxcommon.js" type="text/javascript"></script>
var tabbar; var ldoGrid; var entGrid; function loadDOITabbar() { tabbar = new dhtmlXTabBar("doi_tabbar", "top"); tabbar.setSkin("dhx_blue"); tabbar.setImagePath("../dhtmlx/dhtmlxTabbar/codebase/imgs/"); tabbar.setAlign("left"); tabbar.addTab("ldo", "LDO", "200px"); tabbar.addTab("ent", "ENT", "200px"); tabbar.setTabActive('ldo'); //attach ldo DHTMLX grid ldoGrid = tabbar.cells("ldo").attachGrid(); ldoGrid.setImagePath("../dhtmlx/dhtmlxGrid/codebase/imgs/"); ldoGrid.setHeader("Agreement ID,DOI ID,DOI Type"); ldoGrid.setInitWidths("150,50,55"); ldoGrid.enableMultiline(true); ldoGrid.setColAlign("left,left,left") ldoGrid.setColTypes("ron,ron,ron"); ldoGrid.setColSorting("str,str,str") ldoGrid.setSkin("dhx_blue"); ldoGrid.init(); //attach ent DHTMLX grid entGrid = tabbar.cells("ent").attachGrid(); entGrid.setImagePath("../dhtmlx/dhtmlxGrid/codebase/imgs/"); entGrid.setHeader("DOI ID,DOI Type,Party ID"); entGrid.setInitWidths("50,55,45"); entGrid.enableMultiline(true); entGrid.setColAlign("left,left,left") entGrid.setColTypes("ron,ron,ron"); entGrid.setColSorting("str,str,str") entGrid.setSkin("dhx_blue"); entGrid.init(); ldoGrid.loadXML("/../xml/loadcontent.xml"); entGrid.loadXML("/../xml/loadcontent.xml"); } Below is what I have so far in my XML file and it loads onto the 1st ("ldo") tab: No rows found Any ideas?

Can you clarify the question, please?


If I am loading content on each tab, do I need to create separate XML files for each tab or can it be one XML file? If it is one XML file, how can I identify which grid to load separate data elements?

If you need to load a different data for each grid - you will have to create separate xml files

Ok, thank you.

You are welcome!

Are you using static xml files ?
Or are you generating the files on the server dynamically, if this is the case then you don’t have to generate files and store them, just do your thing with the server side language that you are using then send the result as xml content.