EasyUI DataGrid合并单元

<table id="tt"></table>

$('#tt').datagrid({

    title:'Merge Cells',

    iconCls:'icon-ok',

    600,

    height:300,

    singleSelect:true,

    rownumbers:true,

    idField:'itemid',

    url:'datagrid_data.json',

    pagination:true,

    frozenColumns:[[

        {field:'productid',title:'Product',100,

            formatter:function(value){

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

                    if (products[i].productid == value) return products[i].name;

                }

                return value;

            }

        },

        {field:'itemid',title:'Item ID',80}

    ]],

    columns:[[

        {title:'Price',colspan:2},

        {field:'attr1',title:'Attribute',150,rowspan:2},

        {field:'status',title:'Status',60,align:'center',rowspan:2}

    ],[

        {field:'listprice',title:'List Price',80,align:'right'},

        {field:'unitcost',title:'Unit Cost',80,align:'right'}

    ]]

});

合并单元格

当数据被载入，我们在DataGrid中合并一些单元格，所以放置下列代码在onLoadSuccess函数中。

var merges = [{

    index:2,

    rowspan:2

},{

    index:5,

    rowspan:2

},{

    index:7,

    rowspan:2

}];

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

    $('#tt').datagrid('mergeCells',{

        index:merges[i].index,

        field:'productid',

        rowspan:merges[i].rowspan

    });