• 扩展-Easyui Datagrid相同连续列合并扩展(一)


     

    一.autoMergeCellAndCells实现效果

     

    调用方法:

    function onLoadSuccess(data){

        $(this).datagrid("autoMergeCellAndCells",['productid','productname']);
    }

     

    //所有列进行合并操作
    //$(this).datagrid("autoMergeCellAndCells");
    //指定列进行合并操作
    //$(this).datagrid("autoMergeCellAndCells", ['productid','productname']);
    $(this).datagrid("autoMergeCellAndCells",['productid','productname']);

    二.autoMergeCells实现效果

     

    调用方法:

    function onLoadSuccess(data){
             $(this).datagrid("autoMergeCells",['productid','productname']);
     }

    //所有列进行合并操作
    //$(this).datagrid("autoMergeCells");
    //指定列进行合并操作
    //$(this).datagrid("autoMergeCells", ['productid','productname']);
    $(this).datagrid("autoMergeCells",['productid','productname']);

    三.扩展

    $.extend($.fn.datagrid.methods, {
    autoMergeCells : function (jq, fields) {
    return jq.each(function () {
    var target = $(this);
    if (!fields) {
    fields = target.datagrid("getColumnFields");
    }
    var rows = target.datagrid("getRows");
    var i = 0,
    j = 0,
    temp = {};

    for (i; i < rows.length; i++) {
    var row = rows[i];
    j = 0;
    for (j; j < fields.length; j++) {
    var field = fields[j];
    var tf = temp[field];
    if (!tf) {
    tf = temp[field] = {};
    tf[row[field]] = [i];
    } else {
    var tfv = tf[row[field]];
    if (tfv) {
    tfv.push(i);
    } else {
    tfv = tf[row[field]] = [i];
    }
    }
    }
    }
    $.each(temp, function (field, colunm) {
    $.each(colunm, function () {
    var group = this;

    if (group.length > 1) {
    var before,
    after,
    megerIndex = group[0];
    for (var i = 0; i < group.length; i++) {
    before = group[i];
    after = group[i + 1];
    if (after && (after - before) == 1) {
    continue;
    }
    var rowspan = before - megerIndex + 1;
    if (rowspan > 1) {
    target.datagrid('mergeCells', {
    index : megerIndex,
    field : field,
    rowspan : rowspan
    });
    }
    if (after && (after - before) != 1) {
    megerIndex = after;
    }
    }
    }
    });
    });
    });
    },
    autoMergeCellAndCells : function (jq, fields) {
    return jq.each(function () {
    var target = $(this);
    if (!fields) {
    fields = target.datagrid("getColumnFields");
    }
    var cfield = fields[0];
    if (!cfield) {
    return;
    }
    var rows = target.datagrid("getRows");
    var i = 0,
    j = 0,
    temp = {};
    for (i; i < rows.length; i++) {
    var row = rows[i];
    j = 0;
    var tf = temp[cfield];
    if (!tf) {
    tf = temp[cfield] = {};
    tf[row[cfield]] = [i];

    } else {
    var tfv = tf[row[cfield]];
    if (tfv) {
    tfv.push(i);
    } else {
    tfv = tf[row[cfield]] = [i];

    }
    }
    }

    $.each(temp, function (field, colunm) {
    $.each(colunm, function () {
    var group = this;

    if (group.length > 1) {
    var before,
    after,
    megerIndex = group[0];
    for (var i = 0; i < group.length; i++) {
    before = group[i];
    after = group[i + 1];
    if (after && (after - before) == 1) {
    continue;
    }
    var rowspan = before - megerIndex + 1;
    if (rowspan > 1) {
    for(var j=0;j<fields.length;j++){
    target.datagrid('mergeCells', {
    index : megerIndex,
    field : fields[j],
    rowspan : rowspan
    });
    }
    }
    if (after && (after - before) != 1) {
    megerIndex = after;
    }
    }
    }
    });
    });
    });
    }

    });

  • 相关阅读:
    搭建页面:数据库的增删改查
    阿里云的使用运维安装
    promis:异步编程
    微信开发笔记
    细数那些带打赏功能的平台
    写给自己的TypeScript 入门小纲
    Node.js自学笔记之回调函数
    来简书坚持一个月日更之后
    全选或者单选checkbox的值动态添加到div
    一个前端妹子的悲欢编程之路
  • 原文地址:https://www.cnblogs.com/huangf714/p/5911701.html
Copyright © 2020-2023  润新知