easyUI合并行的单元格

案例：onLoadSuccess: onLoadSuccess 方法设置合并单元格的方法。

<table
class="easyui-datagrid"
title="Merge Cells for DataGrid"
style="width:700px;height:250px"

data-options="

rownumbers: true,

singleSelect: true,

iconCls: 'icon-save',

url: 'datagrid_data1.json',

method: 'get',

onLoadSuccess: onLoadSuccess

">

<thead>

<tr>

<th
data-options="field:'productid',width:100">Product</th>

<th
data-options="field:'itemid',width:80">Item
ID</th>

<th
data-options="field:'listprice',width:80,align:'right'">List
Price</th>

<th
data-options="field:'unitcost',width:80,align:'right'">Unit
Cost</th>

<th
data-options="field:'attr1',width:240">Attribute</th>

<th
data-options="field:'status',width:60,align:'center'">Status</th>

</tr>

</thead>

</table>

<script
type="text/javascript">

function onLoadSuccess(data){

var merges
=
[{

index:
2,//从第三行开始合并

rowspan:
2//合并2行

},{

index:
5,//从第六行开始合并

rowspan:
2//合并2行

},{

index:
7,//从第8行开始合并

rowspan:
2//合并2行

}];

for(var
i=0; i<merges.length;
i++){

$(this).datagrid('mergeCells',{

index: merges[i].index,

field:
'productid',//productid合并的列字段(第一列)

rowspan: merges[i].rowspan

});

}

}

</script>