easyui datagrid 多表头设置
最近在做二维报表,要求报表的表头自定义。在网上找了好久二维报表的插件,一直找不到合适的。后来就用easyui 中的datagrid替代了一下。
根据实际需求,统计的信息可能不是一个模块中的字段信息,所以需要把模块和模块下的字段都显示出来,这就用到了表格中的合并单元格,但是在datagrid中如何实现呢? 如下:
- $('#text').datagrid({
- border : 2,
- nowrap : false,
- fit : true,
- url: '<%=request.getContextPath()%>/report/showreport.action',
- frozenColumns: [[
- { title: '区域名称', field: 'regionname', width: 80, sortable: true}
- ]],
- columns: [
- [{"title":"人员管理","colspan":3},
- {"title":"资料管理","colspan":3}],
- [{"field":"uname0","title":"姓名类似于李","rowspan":1},
- {"field":"config_gender1","title":"性别等于女","rowspan":1},
- {"field":"config_gender2","title":"性别等于男","rowspan":1},
- {"field":"config_datatype0","title":"资料类别等于视频资料","rowspan":1},
- {"field":"config_datatype1","title":"资料类别等于图片资料","rowspan":1},
- {"field":"config_datatype2","title":"资料类别等于文件资料","rowspan":1}]],
- rownumbers: true
- });
结果如下图:
说明:从代码中可以看到,表单数组中有两个数组(一般的表格都是有一个数组), 第一个数组就是表头中第一行,该数组对象中没有field属性,第二个数组就是表头第二行。返回的数据格式中字段以第二个数组中的field属性的值为key。格式如下:
- [{"regionname":" 区域 1","uname0":278,"config_gender1":1516,"config_gender2":2522,"config_datatype0":19,"config_datatype1":538,"config_datatype2":525}]
- 原文出自:http://blog.csdn.net/lishuangzhe7047/article/details/42743895
easyui datagrid 多表头设置的更多相关文章
- EasyUI DataGrid 多级表头设置
使用EasyUI做一个报表统计,需要合并表头为多级表头,核心代码如下: $('#dg').datagrid({ url:'datagrid_data.action', fit : true, fitC ...
- EasyUI datagrid 查询、设置、提交 三
查询 $(“#grid”).datagrid(“load”,{ a: $('#id').val(),b :$('#text').val() }); {} 里面可以 是序列化参数 $(“#grid ...
- 转载 -- jquery easyui datagrid 动态表头 + 嵌套对象属性展示
代码功能: 1.datagrid 的表头由后台生成,可以配置在数据库 2.datagrid 的列绑定数据 支撑嵌套对象 $(function() { var columns = new Array() ...
- Easyui datagrid 去掉表头的checkbox复选框
$(".datagrid-header-check").html(""); 在onLoadSuccess中加入此行代码即可实现datagrid去除表头的chec ...
- JQuery EasyUI datagrid 复杂表头处理
下面是我项目中和网上收集的EasyUI的表头处理的,合适的拿去用吧. 例子1: $('#day_health').datagrid({ url: "sqb_b ...
- EasyUI datagrid 复杂表头处理
1:表头固定(前台写) 参照官方:http://www.jeasyui.net/demo/334.html 效果图: 源代码如下: <!DOCTYPE html> <html> ...
- JQuery EasyUI DataGrid根据条件设置表格行样式(背景色)
1.javascript定义函数返回样式 <script type="text/javascript"> //根据条件设置表格行背景颜色 function setRow ...
- easyui datagrid将表头的checkbox不显示(隐藏)
<script type="text/javascript"> $(function(){ $("#dg").datagrid({ url:&quo ...
- easyui datagrid sort 表头 排序
datagrid的点击列表头刷新,分为两种,一种是页面刷新,不涉及后台服务器数据,不会从新查询数据库,只会刷新当前页数据: 一种是服务器级刷新,会重新加载全部数据. 如果不需要自定义排序,可以直接使用 ...
随机推荐
- 十天学会零基础入门学习Photoshop课程(在线观看)
适合人群:在校学生 在职工作者 淘宝运营者等一系列会操作电脑的人群 课程目录 试学课 课时11前言 8分钟1秒 课时22工作界面 试学课 课时33文件的新建 试学课 课时44文档保存 11分钟24秒 ...
- C#利用开源软件ffMpeg截取视频图片
#region 从视频画面中截取一帧画面为图片 /// <summary> /// 从视频画面中截取一帧画面为图片 /// </summary> /// <param n ...
- HTML5会砸掉iOS和Android开发者的饭碗么?
原生App的颠覆 HTML5的“性工能”障碍得到解决,可以接近原生App的效果,所以它就可以替代原生App吗?很多人认为,即使HTML5会发展的比现在好,也将是与原生App各占一部分市场的格局,要求不 ...
- Django Tutorial 学习笔记
实际操作了Django入门教程中的范例,对一些细节有了更清晰的掌握.感觉只看文档不动手是不行的,只看文档没法真正掌握其中要素之间的关系,看了很多遍也不行,必须动手做了才能掌握.同时,这次练习在Ecli ...
- c# 判断点是否在区域内 点在区域内 在多边形内 判断
方法一 算法 : public int isLeft(Point P0, Point P1,Point P2) { int abc= ((P1.X - P0.X) ...
- Kakfa揭秘 Day5 SocketServer下的NIO
Kakfa揭秘 Day5 SocketServer下的NIO 整个Kafka底层都是基于NIO来进行开发的,这种消息机制可以达到弱耦合的效果,同时在磁盘有很多数据时,会非常的高效,在gc方面有非常大的 ...
- Pandas之容易让人混淆的行选择和列选择
在刚学Pandas时,行选择和列选择非常容易混淆,在这里进行一下讨论和归纳 本文的数据来源:https://github.com/fivethirtyeight/data/tree/master/fa ...
- 网络编程Socket UDP
图表流程 linux udp测试代码 //server.c #include <stdio.h> #include <stdlib.h> #include <errno. ...
- linux tail
tail 命令从指定点开始将文件写到标准输出,使用tail命令的-f选项可以方便的查阅正在改变的日志文件,tail -f filename会把filename里最尾部的内容显示在屏幕上,并且不但刷新, ...
- 【noi2013】【bz3244】树的计数
题目概括:给出树的dfs.bfs序 求树的期望高度 题解:由于我比较懒 先copy一段百度文库的题解~void copy(){我们可以发现,所求的树之所以会有很多种,是因为出现了这种情况:对于A.B, ...