雷林鹏分享:jQuery EasyUI 数据网格 - 合并单元格
jQuery EasyUI 数据网格 - 合并单元格
数据网格(datagrid)经常需要合并一些单元格。本教程将向您展示如何在数据网格(datagrid)中合并单元格。
为了合并数据网格(datagrid)单元格,只需简单地调用 'mergeCells' 方法,并传入合并信息参数,告诉数据网格(datagrid)如何合并单元格。在所有合并的单元格中,除了第一个单元格,其它单元格在合并后被隐藏。

创建数据网格(DataGrid)
url="data/datagrid_data.json"
singleSelect="true" iconCls="icon-save" rownumbers="true"
idField="itemid" pagination="true">
| Product ID | Item ID | ||
|---|---|---|---|
| Price | Attribute | Stauts | |
| List Price | Unit Cost | ||
合并单元格
当数据加载之后,我们合并数据网格(datagrid)中的一些单元格,所以放置下面的代码在 onLoadSuccess 回调函数中。
$('#tt').datagrid({
onLoadSuccess:function(){
var merges = [{
index:2,
rowspan:2
},{
index:5,
rowspan:2
},{
index:7,
rowspan:2
}];
for(var i=0; i<merges.length; p="" i++)<="">
$('#tt').datagrid('mergeCells',{
index:merges[i].index,
field:'productid',
rowspan:merges[i].rowspan
});
}
});
下载 jQuery EasyUI 实例
jeasyui-datagrid-datagrid13.zip
本文转载自:w3cschool(编辑:雷林鹏 来源:网络 侵删)
雷林鹏分享:jQuery EasyUI 数据网格 - 合并单元格的更多相关文章
- JQuery EasyUI DataGrid动态合并单元格
/** * EasyUI DataGrid根据字段动态合并单元格 * @param fldList 要合并table的id * @param fldList ...
- 雷林鹏分享:jQuery EasyUI 数据网格 - 创建属性网格
jQuery EasyUI 数据网格 - 创建属性网格 属性网格(property grid)带有一个内置的 expand(展开)/collapse(合并) 按钮,可以简单地为行分组.您可以简单地创建 ...
- 雷林鹏分享:jQuery EasyUI 数据网格 - 设置冻结列
jQuery EasyUI 数据网格 - 设置冻结列 本实例演示如何冻结一些列,当用户在网格上移动水平滚动条时,冻结列不能滚动到视图的外部. 为了冻结列,您需要定义 frozenColumns 属性. ...
- 雷林鹏分享:jQuery EasyUI 数据网格 - 创建复杂工具栏
jQuery EasyUI 数据网格 - 创建复杂工具栏 数据网格(datagrid)的工具栏(toolbar)可以包含按钮及其他组件. 您可以通个一个已存在的 DIV 标签来简单地定义工具栏布局,该 ...
- 雷林鹏分享:jQuery EasyUI 数据网格 - 动态改变列
jQuery EasyUI 数据网格 - 动态改变列 数据网格(DataGrid)列可以使用 'columns' 属性简单地定义.如果您想动态地改变列,那根本没有问题.为了改变列,您可以重新调用dat ...
- 雷林鹏分享:jQuery EasyUI 数据网格 - 格式化列
jQuery EasyUI 数据网格 - 格式化列 以下实例格式化在 easyui DataGrid 里的列数据,并使用自定义列的 formatter,如果价格小于 20 就将文本变为红色. 为了格式 ...
- 雷林鹏分享:jQuery EasyUI 数据网格 - 设置排序
jQuery EasyUI 数据网格 - 设置排序 本实例演示如何通过点击列表头来排序数据网格(DataGrid). 数据网格(DataGrid)的所有列可以通过点击列表头来排序.您可以定义哪列可以排 ...
- 雷林鹏分享:jQuery EasyUI 数据网格 - 创建列组合
jQuery EasyUI 数据网格 - 创建列组合 easyui 的数据网格(DataGrid)可以创建列组合,如下所示: 在本实例中,我们使用平面数据来填充数据网格(DataGrid)的数据,并把 ...
- 雷林鹏分享:jQuery EasyUI 数据网格 - 自定义排序
jQuery EasyUI 数据网格 - 自定义排序 如果默认的排序行为不满足您的需求,您可以自定义数据网格(datagrid)的排序行为. 最基础的,用户可以在列上定义一个排序函数,函数名是 sor ...
随机推荐
- Codeforces 659 - A/B/C/D/E/F/G - (Undone)
链接:https://codeforces.com/contest/659 A - Round House - [取模] AC代码: #include<bits/stdc++.h> usi ...
- Linux 中的 Install命令
Linux 中的 Install命令 更新时间:2017年09月25日 16:51:45 投稿:mrr 我要评论 install命令的作用是安装或升级软件或备份数据,它的使用权限是所有用户. ...
- Linux学习8-CentOS部署自己本地的django项目
前言 自己本地写好的django项目,如何部署到linux服务器上,让其他的小伙伴也能访问呢?本篇以centos系统为例,把本地写好的django项目部署到linux服务器上 环境准备: 环境准备: ...
- 微信小游戏跳一跳简单手动外挂(基于adb 和 python)
只有两个python文件,代码很简单. shell.py: #coding:utf-8 import subprocess import math import os def execute_comm ...
- 消息服务jms
jms是java消息服务的规范,也即接口,activemq是实现.队列模型和发布订阅模型很像,区别就是队列,多个消费者消费不同的消息(这些消费者整体消费完生产者生产的队列的消息),发布订阅模型是多个消 ...
- python笔记-文件读写
文件操作过程一般为:打开.读写.关闭: 打开:open()或file() 读写:read().write(): 关闭:close(): 1.打开:open()或file() file_handler= ...
- emqtt日志、证书、集群状态等位置
1.日志 进入pod后,cd /var/log/emqttd/ 可以看到四种日志 2.证书等位置 cd /etc/emqttd 3.集群状态查询位置 任意位置 emqttd_ctl cluster s ...
- 【Java】NO.80.Note.1.Java.1.001-【Java 各种特性概念】
1.0.0 Summary Tittle:[Java]NO.80.Note.1.Java.1.001-[Java 各种特性概念] Style:Java Series:Java Since:2018-0 ...
- 《Java程序设计》第二周学习记录(1)
目录 第2章 基本数据类型与数组 2.1 标识符与关键字 2.2 基本数据类型 2.3 类型转换运算 2.4 输入.输出数据 2.5 数组 参考资料 第2章 基本数据类型与数组 2.1 标识符与关键字 ...
- 笔记:Linux(AWS Redhat)开机启动workman进程(/etc/rc.local必须是755权限)
1.使用which命令查看php的安装路径 [root@ip---- ~]# which php /usr/bin/php 2.使用vim /etc/rc.local将要执行的命令加入/etc/rc. ...