一.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;
}
}
}
});
});
});
}

});

扩展-Easyui Datagrid相同连续列合并扩展(一)的更多相关文章

  1. Easyui Datagrid相同连续列合并扩展(二)

    JS: //合并相同数据的单元格 function MergeCells(seletor, rows, fields) { if(rows == null || rows.length == 0 || ...

  2. Easyui Datagrid相同连续列合并扩展(三)

    function MergeCells(seletor, rows, fields) { if(rows == null || rows.length == 0 || fields == null | ...

  3. jQuery Easyui Datagrid相同连续列合并扩展

    /** * author ____′↘夏悸 * create date 2012-11-5 **/$.extend($.fn.datagrid.methods, { autoMergeCells : ...

  4. EasyUI DataGrid 相同连续列合并

    扩展方法:$.extend($.fn.datagrid.methods, { autoMergeCells: function(jq, fields) { return jq.each(functio ...

  5. Easyui Datagrid相同连续列合Demo之三

    效果图: html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> < ...

  6. 完美实现保存和加载easyui datagrid自定义调整列宽位置隐藏属性功能

    需求&场景 例表查询是业务系统中使用最多也是最基础功能,但也是调整最平凡,不同的用户对数据的要求也不一样,所以在系统正式使用后,做为开发恨不得坐在业务边上,根据他们的要求进行调整,需要调整最多 ...

  7. (转)扩展jquery easyui datagrid 之动态绑定列和数据

    本文转载自:http://blog.csdn.net/littlewolf766/article/details/7336550 easyui datagrid 不支持动态加载列,上次使用的方法是自己 ...

  8. 扩展easyui.datagrid,添加数据loading遮罩效果代码 --来自网摘收集

    //jquery.datagrid 扩展 (function (){ $.extend($.fn.datagrid.methods, { //显示遮罩 loading: function(jq){ r ...

  9. jQuery扩展easyui.datagrid,添加数据loading遮罩效果代码

    //jquery.datagrid 扩展加载数据Loading效果 (function (){ $.extend($.fn.datagrid.methods, { //显示遮罩 loading: fu ...

随机推荐

  1. C#应用视频教程1.3 Socket通信客户端完善

    我们先把前面的代码封装成一个完整的类,因为跟网络相关的方法并不一定是建立socket的服务器和客户端,所以还是应该把两个分开,比如获取本机IP,修改本机IP,PING远程主机这些事情应该放在一个单独的 ...

  2. javascript - 字符串比较

    1. sort是排序根据字符的ASCIll码排序的,不分字符串或其它元素(仅适用于数组) 2. split是将字符串转为数组形式 3. join是将数组转为字符串形式 4. indexOf找到元素后返 ...

  3. jquery翻页

    http://js.itivy.com/simplePagination.js/index.html#page-10 http://www.oschina.net/news/41941/7-html5 ...

  4. taro 更新

    更新 Taro 提供了更新命令来更新 CLI 工具自身和项目中 Taro 相关的依赖 更新 Taro CLI 工具 # taro $ taro update self # npm npm i -g @ ...

  5. 自己主动化測试使用mybatis更新数据库信息实例

    代码例如以下: mybatis配置文件: <? xml version="1.0" encoding="UTF-8"?> <!DOCTYPE ...

  6. Python 正则表达式学习摘要及资料

    来源:Michael_翔_ 摘要 在正则表达式中,如果直接给出字符,就是精确匹配. {m,n}? 对于前一个字符重复 m 到 n 次,并且取尽可能少的情况 在字符串'aaaaaa'中,a{2,4} 会 ...

  7. Hadoop-1.2.1学习之Job创建和提交源码分析

    在Hadoop中,MapReduce的Java作业通常由编写Mapper和Reducer開始.接着创建Job对象.然后使用该对象的set方法设置Mapper和Reducer以及诸如输入输出等參数,最后 ...

  8. android TextView异常换行层次不齐的问题

    关于TextView异常换行,参差不齐问题分析:每行的开头的第一个字符如果是字母,数字,标点符号以及特殊字符 可能是由于都是半角字符,所以需要转化成全角字符 解决方法是: public String ...

  9. 【TP3.2】模板布局和文件引入

    TP3.2框架引入文件使用<include file="blue/common/header">标签,==>blue主题下的公共头文件(blue放在View/目录 ...

  10. mosquitto --用户配置 及权限管理

    mosquitto中可以添加多个用户,只有使用用户名和密码登陆服务器才允许用户进行订阅与发布操作.可以说用户机制是mosquitto重要的安全机制,增强服务器的安全性.用户与权限配置需要修改3处地方: ...