Bootstrap-table实现动态合并相同行

Bootstrap-table  表格合并相同名字的列

Bootstrap-table实现动态合并相同行_第1张图片

@编写function()

/**
   * 合并行
   * @param data  原始数据(在服务端完成排序)
   * @param fieldName 合并属性名称数组
   * @param colspan 列数
   * @param target 目标表格对象
   */
  function mergeCells(data, fieldName, colspan, target) {
    if (data.length == 0) {
      alert("不能传入空数据");
      return;
    }
    var numArr = [];
    var value = data[0][fieldName];
    var num = 0;
    for (var i = 0; i < data.length; i++) {
      if (value != data[i][fieldName]) {
        numArr.push(num);
        value = data[i][fieldName];
        num = 1;
        continue;
      }
      num++;
    }
    var merIndex = 0;
    for (var i = 0; i < numArr.length; i++) {
      $(target).bootstrapTable('mergeCells', { index: merIndex, field: fieldName, colspan: colspan, rowspan: numArr[i] })
      merIndex += numArr[i];
    }
  }

 

 

完整代码:html/js

 




  
  Title
  
  
  
  
  



table

  

 !!!!!!!!!!!!上面的这个合并行的方法有点问题  : 下面这个方法是可以的 !!!!!!!!!

 

/*
合并行
 @param data  原始数据(在服务端完成排序)
 @param fieldName 合并属性名称数组
 @param colspan 列数
 @param target 目标表格对象
*/
function mergeCells(data, fieldName, colspan, target) {
  if (data.length == 0) {
    alert("不能传入空数据");
    return;
  }
  var numArr = [];
  var value = data[0][fieldName];
  var num = 0;
  for (var i = 0; i < data.length; i++) {
    if (value != data[i][fieldName]) {
      numArr.push(num);
      value = data[i][fieldName];
      num = 1;
      continue;
    }
    num++;
  }
  if (typeof (value) != "undefined" && value != "") {
    numArr.push(num);
  }
  var merIndex = 0;
  for (var i = 0; i < numArr.length; i++) {
    $(target).bootstrapTable('mergeCells',
        {
          index: merIndex,
          field: fieldName,
          colspan: colspan,
          rowspan: numArr[i]
        })
    merIndex += numArr[i];
  }
}

 

  

 

转载于:https://www.cnblogs.com/zhukaixin/p/11376654.html

你可能感兴趣的:(javascript)