the common function for EasyUI dataGrid merge cells[合并单元格通用方法]

tools.js

void function (t) {
    /**
     * 计算相对宽度
     * @param percent 百分比整数
     * @param totalWidth 表格总宽度
     * @param checkboxCount 单选框列数
     * @return {number}
     */
    t.getWidth = function (percent, totalWidth, checkboxCount) {
        totalWidth = totalWidth ? totalWidth : document.body.clientWidth;
        checkboxCount = checkboxCount ? checkboxCount : 1;//默认表格中有一个checkbox 占用28px
        return (totalWidth - 28 * checkboxCount) * percent / 100;
    };
  
    /**
     * 合并EasyUI DataGrid 单元格
     * @param $grid jQuery对象
     * @param data dataGrid数据
     * @param fieldArray 需要合并的单元格名称数组
     */
    t.mergeRows = function ($grid, data, fieldArray) {
        var rows = data.rows;
        var result = {};
        if (rows.length > 0 && fieldArray.length > 0) {
            for (var i in fieldArray) {
                if (fieldArray.hasOwnProperty(i)) {
                    var field = fieldArray[i];
                    var index, rowspan, value;
                    result[field] = [];
                    for (var j in rows) {
                        if (rows.hasOwnProperty(j)) {
                            var row = rows[j];
                            if (j == 0) {
                                //初始化
                                index = 0;
                                rowspan = 0;
                                value = row[field];
                            }
                            if (value == row[field]) {
                                //当值相同时，合并单元格数增加
                                rowspan++;
                            } else {
                                //当值不相同时
                                if (rowspan > 1) {
                                    //只合并2个以上单元格
                                    result[field].push({
                                        index: index,
                                        rowspan: rowspan
                                    });
                                } else {
                                    //否则重置rowspan
                                    index = j;
                                    rowspan = 1;
                                }
                            }
                            value = row[field];
                        }
                    }
                    //最后判断一次
                    if (rowspan > 1) {
                        //只合并2个以上单元格
                        result[field].push({
                            index: index,
                            rowspan: rowspan
                        });
                    }
                }
            }
            // console.log(result);
            //计算出需要合并的数组 index-列 rowspan-合并行数
            for (var key in result) {
                var merges = result[key];
                for (var k = 0; k < merges.length; k++) {
                    $grid.iDatagrid('mergeCells', {
                        index: merges[k].index,
                        field: key,
                        rowspan: merges[k].rowspan
                    });
                }
            }
        }
    };
}(window.tools = {});

//-----------------------------以上方法的调用示例----------------------------
$("#grid").iDatagrid({
    rownumbers: false,
    remoteFilter: true,
    url: '/customer_list.json',//客户数据数组
    columns: [[
        {field: '', title: '', checkbox: true},
        {field: 'customerCode', title: '客户编号', sortable: true, width: tools.getWidth(10)},
        {field: 'customerName', title: '客户名称', sortable: true, width: tools.getWidth(20)},
        {field: 'contacts', title: '客户联系人', sortable: true, width: tools.getWidth(10)},
        {field: 'contactPhone', title: '客户联系方式', sortable: true, width: tools.getWidth(15)},
        {field: 'address', title: '客户地址', sortable: true, width: tools.getWidth(45)}
    ]], onLoadSuccess: function (data) {
        //合并相同客户编号与客户名称的数据，必须是经过排序之后的相邻数据才能合并
        tools.mergeRows($(this), data, ['customerCode','customerName']);
    }
});