热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

bootstrapTable实现合并相同行

这篇文章主要为大家详细介绍了bootstrapTable实现合并相同行,fastadmin框架同样使用,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

本文实例为大家分享了bootstrapTable实现合并相同行的具体代码,供大家参考,具体内容如下

方法:调用mergeCells(data, fieldName, target),可以实现合并相同行

 var table = $("#table");
 // 初始化表格
    table.bootstrapTable({
     url: $.fn.bootstrapTable.defaults.extend.index_url,
     pk: 'id',
     sortName: 'update_time',
     search: false,
     toolbar: '#toolbar',
     commonSearch: true,
     pageSize : 12,
     searchFormVisible: true,
     queryParams: function (params) {
      //这里可以追加搜索条件
      var filter = JSON.parse(params.filter);
      var op = JSON.parse(params.op);
      //这里可以动态赋值,比如从URL中获取admin_id的值,filter.admin_id=Fast.api.query('admin_id');
      // filter.admin_id = 1;
      if(filter.is_bujiao=='是')
       filter.is_bujiao=1
      if(filter.is_bujiao=='否')
       filter.is_bujiao=0
      op.username = "like";
      params.filter = JSON.stringify(filter);
      params.op = JSON.stringify(op);
      return params;
     },
     columns: [
      [ 
      {field: 'total_order_id', title: '总订单号',sortable: true,width: "150px",formatter: Table.api.formatter.search}
      ]
     ],
     
     onLoadSuccess: function (data) {
      mergeCells(data, "total_order_id", $("#table"));
     },
    });
 
// 为表格绑定事件
Table.api.bindevent(table);
 /**
 * 合并相同行
 * @param data 原始数据(在服务端完成排序)
 * @param fieldName 合并属性数组
 * @param target 目标表格对象
 */
function mergeCells(data, fieldName, target) {
 setTimeout(function () {
  if (data.rows.length == 0) {
   return;
  }
  var numArr = [];
  var number=0;
  var classzhi='dan';
  if( data.rows.length>1){
   for (let i = 0; i 

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。


推荐阅读
  • 本文介绍了前端人员必须知道的三个问题,即前端都做哪些事、前端都需要哪些技术,以及前端的发展阶段。初级阶段包括HTML、CSS、JavaScript和jQuery的基础知识。进阶阶段涵盖了面向对象编程、响应式设计、Ajax、HTML5等新兴技术。高级阶段包括架构基础、模块化开发、预编译和前沿规范等内容。此外,还介绍了一些后端服务,如Node.js。 ... [详细]
  • Postman工具使用教程
    Postman的基础功能1.GET请求GET请求:点击Params,输入参数及value,可输入多个,即时显示在URL链接上,所以,GET请求的请求头与请求参数如在接口文档中无特别 ... [详细]
  • 抓取百万知乎用户设计之实体设计
    一.实体的关系实体是根据返回的Json数据来设计的教育经历方面用户可以有很多教育经理,USER和education是一对多的关系,一个education对应一个education一 ... [详细]
  • Bootstrap datetimepicker控件 日期时间选择器 简单使用
    bootstrap-datetimepicker日期控件简单使用应用场景:表单日期 ... [详细]
  • 在网上看到有Bootstrap2的Modaldialog垂直居中问题解决方法,这种方法自己试了一下,并不能完全居中,并且窗口的大小不一样的话,每次显示的margin-top值也会改 ... [详细]
  • 本文介绍了高校天文共享平台的开发过程中的思考和规划。该平台旨在为高校学生提供天象预报、科普知识、观测活动、图片分享等功能。文章分析了项目的技术栈选择、网站前端布局、业务流程、数据库结构等方面,并总结了项目存在的问题,如前后端未分离、代码混乱等。作者表示希望通过记录和规划,能够理清思路,进一步完善该平台。 ... [详细]
  • springboot 事务 抛出异常_Spring Boot(四) 异常处理
    一、参数校验错误1.注解校验注解校验的常见形式是,在JavaBean类中添加javax.validation校验注解,在控制器方法参数前添加Valida ... [详细]
  • WebBrowser控件(1)
    WindowsPhone7内置了一个强大的网络浏览器,该浏览器的内核是基于桌面版的InternetExplorer7(Mango版基于InternetE ... [详细]
  • HTTP请求响应的步骤第一步:第二步:第三步:第四步:第五步第一步:1.客户端连接到Web服务器⼀个HTTP ... [详细]
  • 3295:[Cqoi2011]动态逆序对Description对于序列A,它的逆序对数定义为满足iAj的数对(i,j)的个数。给1到n的一个排列,按照某种顺序依次删除 ... [详细]
  • 猫猫分享,必须精品原文地址:http:blog.csdn.netu013357243articledetails44571163素材地址:http:download.csdn.n ... [详细]
  • js Blob对象实现文件下载功能
    2019独角兽企业重金招聘Python工程师标准jsBlob对象实现文件下载功能,可以将字符串放到文件夹里,提供下载功能。下载功能$(#down ... [详细]
  • 《ASP.NET MVC 4 实战》 1.3  ASP.NET MVC 3/4的新特性
    本节书摘来自异步社区《ASP.NETMVC4实战》一书中的第1章,第1.3节,作者:【美】JeffreyPalermo,【美】JimmyB ... [详细]
  • jquery调用网易云音乐API遇到,网易音乐接口需要用node启动前端js调用代码varthisUrlhttp:127.0.0.1:3000 ... [详细]
  • (一)前言:二次开发编辑器neditor(基于百度编辑器ueditor):界面相对于ueditor会更美观.(二)问题描述:最近在公司项目中遇到一个比较奇葩的问题。neidito ... [详细]
author-avatar
顽石1129_659
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有