Start Building Professional
Web Apps Today

dhx Tabbar doesn't work with attaching grid after it has been cleared once

Hello,

I have a page that uses dhx Layout, Tabbar and Grid, (Using latest build of Grid, and Windows. Others seems to break the current application if all use newest version together, so using 81009 for others)
The initialization is Layout -> Tabbar -> Grid
There's another part in the page which uses Accordion, but that does not cause problem so far. When I click a button in the page, I want the Tabbar to reinitialize its content (clearling all tab, and retrieve data according the parameter passed by ajax to server and reconstruct the content of Tabbar for the tabs and it's grid content)
here's the code I am using:

Initialization:

var grids = new Array(); //global array

var dhxLayout = new dhtmlXLayoutObject(document.body, "2U", "dhx_blue");
var mytabbar = dhxLayout.cells("b").attachTabbar();
mytabbar.setImagePath("dhtmlxTabbar/codebase/imgs/");
mytabbar.setOnSelectHandler(tabClick);
mytabbar.enableScroll(false);
mytabbar.enableAutoRow(true);
mytabbar.enableAutoSize(true);
mytabbar.enableAutoReSize(true,true);
mytabbar.preventIECashing(true);
mytabbar.loadXMLString ('<tabbar><row><tab id="1" width="90">1</tab><tab id="2" width="90">g9</tab></row></tabbar>'); //the actual data might differ, but just for illustration of the problem
mytabbar.setTabActive(1); //for the first tab

mygrid2 = dhxAccord.cells("a3").attachGrid(); //attaching grid to a content for Accordion

function tabClick (tabID) //here's what happens when a tab is clicked
{
try
{
mygrid2.destructor();
}
catch(e){}    

var http = getHTTPObject ();
var instanceID = document.getElementById ("instanceid").value;
var year = document.getElementById ("Year").value;
http.open ("POST", "AjaxStats.go?job=" + "getGridandStat" + "&year="+year+"&instanceID=" + instanceID + "&usergrid="+tabID, true);
http.onreadystatechange = function () {
    if (http.readyState == 4) {
        var ret=http.responseText;
        var split = ret.split("#####");
            
        if (ret.indexOf ("Error") > 0) {
            return false;
        } else {
            try
            {
             grids[tabID].destructor();
            }
            catch(e){}
    
            mygrid2 = dhxAccord.cells("a3").attachGrid();
            mygrid2.selMultiRows = true;
            mygrid2.setHeader("Available Statistics");
            mygrid2.setInitWidths("*");
            mygrid2.enableDragAndDrop(true);
            mygrid2.setNoHeader(true);
            mygrid2.init();
            mygrid2.parse(split[1]);

            grids[tabID] = mytabbar.cells(tabID).attachGrid();     <-- where it breaks later                 grids[tabID].selMultiRows = true;
            grids[tabID].setHeader('<div style="text-align:center;">Name</div>,Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec,TOTAL');
            grids[tabID].setInitWidths("200,50,50,50,50,50,50,50,50,50,50,50,50,50");
            grids[tabID].setColAlign("left,right,right,right,right,right,right,right,right,right,right,right,right,right");
            grids[tabID].enableContextMenu(bMenu);
            grids[tabID].attachEvent ("onBeforeContextMenu", changeMenu);
            grids[tabID].enableUndoRedo();
            grids[tabID].setColTypes('ro,edn,edn,edn,edn,edn,edn,edn,edn,edn,edn,edn,edn,math');
          grids[tabID].setSkin(document.getElementById('skin').value);
            grids[tabID].enableRowsHover(true,'grid_hover');    
            grids[tabID].init();
            grids[tabID]._refresh_mode=[true,true];
            grids[tabID].parse(split[0]);        
        return true;
        }
    }
}
http.send();
return true;
}

When the tabbar is reinitialized, the code I am using is:

mytabbar.clearAll();
mytabbar.loadXMLString ('<tabbar><row><tab id="1" width="90">1</tab><tab id="2" width="90">g9</tab></row></tabbar>'); //again this data is not always the same, but just for illustration purpose

but here comes the problem, after this tabbar is reinitialized, if I click on any tab, or if I run the code mytabbar.setTabActive(id of a tab), the tabclick function gets called, but once it reaches the line
grids[tabID] = mytabbar.cells(tabID).attachGrid();
IE breaks, Error: object required

I tried using ie script debugger and saw the error is from dhx Windows !?
I am not sure if I am doing the right way to reinitialize the tabbar or if there's something that might be missing from my code or is this a problem?


Thanks

Updated version of dhtlmxtabbar.js sent by email, please try to use it instead of original one.