How to apply rowspan and colspan to cell in Dhtmlx Grid view

Question

My dhtmlxgrid view looks like the below mentioned.Using Json data.

code    desc         Qtytype    w1  w2

Part A  Part A desc   Demand    100 200
                      issued    150 100
                       stock    200 200
                       F/C  100 250     
Part B  Part B desc   Demand    100 200
                      issued    200 100
                       stock    300 200
                        F/C     100 250

I want to apply the rowsapn and colspan cell level.Kindly anyone suggest how to apply span in the cell level to make the view aboved.Thanks in advance.

score 1 · Answer 1 · answered Dec 03 '12 at 09:33

There are two ways

a) after data loading you can use js api to make necessary col and rowspans

grid.load("some.url", function(){
    grid.setRowspan(1,0,4) //1 - id of row 
    grid.setRowspan(1,1,4) //1 - id of row 
});

b) you can define rowspans directly in data, in case of xml it will be

<row id="1"><cell rowspan="4">Part A</cell>

as far as I know the similar syntax must be available for json, but it is buggy in current version (3.5) and works for xml only.

i want to apply rowspan in json data similar to xml format specfied. — Abdul, Dec 03 '12 at 11:40

score 0 · Accepted Answer · answered Dec 11 '12 at 06:23

After Data loaded you can apply like this

dfGrid.forEachRow(function(id){
if((id)%4==0)
{   
   dfGrid.forEachCell(id,function(cellObj,ind){
   if(ind <= 3){
    dfGrid.setRowspan(id,ind,4);
    }       
    });
}   
});

4 denotes how many row you need to apply. 3 denotes how many coloumn rowspan should be applied.

Note -- Id should be starts from the multiple of 4. based on the no of row the value of id varied ex.3 means id should start with multiple of 3.

Thank you.

How to apply rowspan and colspan to cell in Dhtmlx Grid view

2 Answers2