Hello,
I am receiving an error when calling “splitAt(4)” or “splitAt(5)” within a grid that has multiple headers, with the first header containing grouped columns. I am trying to do the split inbetween groups (there is one column inbetween the two groups as well) or within the first column of the second grouping. If the splitAt is anywhere except the first column, though, I receive the following error:
TypeError: Cannot read property 'style' of undefined
at Object.sync_headers._fake.sync_headers (http://localhost:7777/lib/dhtmlx/dhtmlx.js:1210:461)
at Object.setSizes (http://localhost:7777/lib/dhtmlx/dhtmlx.js:1208:205)
at Object.dhtmlXGridObject.splitAt (http://localhost:7777/lib/dhtmlx/dhtmlx.js:1229:50)
at eval (eval at <anonymous> (http://localhost:7777/lib/jquery-2.0.3.min.js:4:4231), <anonymous>:852:13)
at eval (native)
at Function.x.extend.globalEval (http://localhost:7777/lib/jquery-2.0.3.min.js:4:4231)
at x.fn.extend.domManip (http://localhost:7777/lib/jquery-2.0.3.min.js:5:21391)
at x.fn.extend.append (http://localhost:7777/lib/jquery-2.0.3.min.js:5:18985)
at null.<anonymous> (http://localhost:7777/lib/jquery-2.0.3.min.js:5:20357)
at Function.x.extend.access (http://localhost:7777/lib/jquery-2.0.3.min.js:4:5768)
The structure of the grid is the following:
mygrid3 = new dhtmlXGridObject('grid');
mygrid3.setHeader("<div class='disabledHeader'>Slot ID</div>,<div class='firstColGroupHeader'>Rack Data</div>,#cspan,Slot,<div class='firstColGroupHeader'>Card-Specific Data</div>,#cspan,#cspan,#cspan,#cspan,#cspan,#cspan,#cspan,#cspan,#cspan,#cspan,#cspan,#cspan,#cspan,#cspan,#cspan,#cspan,#cspan,#cspan,#cspan,#cspan,#cspan,#cspan");
mygrid3.attachHeader("#rspan,Panel,Rack,#rspan,<div class='disabledHeader'>Card ID</div>, Card, General Type,Specific Type,# Points,Notes,IO TB,<div class='secColGroupHeader'>(PW) L1 / +</div>,#cspan,#cspan,#cspan,<div class='secColGroupHeader'>(PW) L2 / - (COM)</div>,#cspan,#cspan,#cspan, Drawing , Series, Version, Controller Name,System Served,Device Serial #,<div class='secColGroupHeader'>Current</div>,#cspan");
mygrid3.attachHeader("#rspan,#rspan,#rspan,#rspan,#rspan,#rspan,#rspan,#rspan,#rspan,#rspan,#rspan,Wire #,<div class='orangeHeader'>TB</div>,<div class='orangeHeader'>T#</div>,Color,Wire #,<div class='orangeHeader'>TB</div>,<div class='orangeHeader'>T#</div>,Color,#rspan,#rspan,#rspan,#rspan,#rspan,#rspan,@5,@2");
mygrid3.attachHeader("#combo_filter,#combo_filter,#combo_filter,#combo_filter,#combo_filter,#text_filter,#combo_filter,#combo_filter,#combo_filter,#combo_filter,#combo_filter,#combo_filter,#combo_filter,#combo_filter,#combo_filter,#combo_filter,#combo_filter,#combo_filter,#combo_filter,#combo_filter,#combo_filter,#combo_filter,#combo_filter,#combo_filter,#combo_filter,#combo_filter,#combo_filter");
mygrid3.setInitWidths("40,120,40,40,40,80,80,80,50,80,40,60,40,40,50,60,40,40,50,70,80,100,80,80,80,45,50");
mygrid3.setStyle("padding:3px 2px",null,null)
mygrid3.enableAutoHeight(true,maxGridHeightWithHooders,null);
mygrid3.setColAlign("left,left,left,left,left,left,left,left,left,left,left,left,left,left,left,left,left,left,left,left,left");
mygrid3.init();
mygrid3.splitAt(4);
mygrid3.loadXMLString(gridDataString);
Could you please let me know how I can get this working? I’d very much appreciate it. The complex column grouping and column freezing are the requirements we are working towards.
Thank you