easyui datagrid 动态合并单元格

(function ($) {
    /**
     * Created by XuGuang on 2016/8/2.
     */
//----------------------------------默认加载列表-----------------------------------------------------
    var columns = [
        {field:'adMamMedia.mediaName',title:'媒资名称',width:150,align:'center'},
        {field:'spcesName',title:'媒资规格',width:200,align:'center'},
        {field:'adMamMedia.sourceName',title:'媒资来源',width:80,align:'center'},
        {field:'adMamMedia.sourceTypeName',title:'媒资类型',width:80,align:'center'},
        {field:'achieveType',title:'广告承载形式',width:100,align:'center'},
        {field:'specs',title:'报价规格',width:200,align:'center',
            formatter:function(value){
                if(value != null){
                    value = value.replace(/\n/g,'<br>')
                }
                return value;
            }
        },
        {field:'price',title:'单价',width:120,align:'center'},
        {field:'remark',title:'备注',width:230,align:'left',
            formatter:function(value){
                if(value != null){
                    value = value.replace(/\n/g,'<br>') //判断有/n的就换行
                }
                return value;
            }
        }
    ];
    var columnStyler = function(){
        return 'background-color:#fff';
    };
    for (var i = 0; i < columns.length; i++) {
        var column = columns[i];
        column.styler = columnStyler; //为所有改变背景颜色为白色
    }
    $('#media_datagrid').datagrid({
        loadMsg : '请稍候......',
        nowrap:false,
        checkOnSelect:false,
        selectOnCheck:false,
        pagination:true,    //如果为true,则在DataGrid控件底部显示分页工具栏。
        rownumbers:true,    //如果为true,则显示一个行号列。
        singleSelect:true, //如果为true,则只允许选择一行。
        columns:[columns],
        onLoadSuccess:function(data){ MergeCells('media_datagrid','remark,adMamMedia.mediaName,specs');}
    });

//----------------------------------查询-----------------------------------------------------
    $("#mzlb [tag='search']").click(function(){
        $('#media_datagrid').datagrid('load',{
            'adMamMedia.mediaName': $("[name='mediaName']").val()
        });
    });

//----------------------------------清空-----------------------------------------------------
    $("#mzlb [tag='clear']").click(function(){
        $("[name='mediaName']").val('')
        $('#media_datagrid').datagrid("load",{});
    });

    /*
     * EasyUI DataGrid根据字段动态合并单元格
     * @param fldList 要合并table的id
     * @param fldList 要合并的列,用逗号分隔(例如:"name,department,office");
     */
    function MergeCells(tableID, fldList) {
        var Arr = fldList.split(",");
        var dg = $('#' + tableID);
        var fldName;
        var RowCount = dg.datagrid("getRows").length;
        var span;
        var PerValue = "";
        var CurValue = "";
        var length = Arr.length - 1;
        var sonFldname = "";
        var fldNameS = "";
        for (i = length; i >= 0; i--) {
            fldName = Arr[i];
            PerValue = "";
            span = 1;
            for (row = 0; row <= RowCount; row++) {
                if (row == RowCount) {
                    CurValue = "";
                } else {
                    if(fldName.indexOf('.')>0){
                        var ArrFldName = fldName.split('.')
                        fldNameS = ArrFldName[0];
                        sonFldname = ArrFldName[1];
                        CurValue = dg.datagrid("getRows")[row][fldNameS][sonFldname];
                    }else{
                        CurValue = dg.datagrid("getRows")[row][fldName];
                    }
                }
                if (PerValue == CurValue) {
                    span += 1;
                } else {
                    var index = row - span;
                    dg.datagrid('mergeCells', {
                        index: index,
                        field: fldName,
                        rowspan: span,
                        colspan: null
                    });
                    span = 1;
                    PerValue = CurValue;
                }
            }
        }
    }
})(jQuery);
  • 3
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值