用JavaScript方式创建easyUI datagrid Column Group(列组)
代码如下:
- <script type="text/javascript">
- var datagrid;
- $(function(){
- $('#datagrid').datagrid({
- url:'{:U("Admin/Article/indexjson")}',
- title:'',
- iconCls:'icon-save',
- fit:true,
- //下面的page条
- pagination:true,
- pageSize:14,
- pageList:[14,20,30,40,50],
- //是否出现横向滚动条
- fitColumns:true,
- //数据折行
- nowrap:false,
- border:false,
- //帮你记住你选过的,做跨页删除
- idField:'id',
- columns:[[{
- title:'',
- field:'ck',
- checkbox:true,
- width:10,
- rowspan:2
- },{
- title:'ID',
- field:'id',
- width:50,
- rowspan:2,
- align:'center'
- },{
- title:'文章标题',
- field:'title',
- width:350,
- rowspan:2
- },{
- title:'属性',
- align:'center',
- colspan:3
- },{
- title:'所属栏目',
- field:'name',
- width:150,
- rowspan:2
- },{
- title:'所属专题',
- field:'name',
- width:150,
- rowspan:2
- },{
- title:'发布时间',
- field:'time',
- width:150,
- align:'center',
- rowspan:2
- }
- ],[
- {
- title:'推荐',
- field:'good',
- width:50,
- align:'center'
- },{
- title:'热门',
- field:'hits',
- width:50,
- align:'center'
- },{
- title:'图',
- field:'pic',
- width:50,
- align:'center'
- },
- ]],toolbar:"#tb"
- });
- });
- function doSearch(value){
- //alert('You input: ' + value);
- $('#datagrid').datagrid('load',{
- title:$('#tb').find('[name=search]').val()
- });
- }
- function doAdd(){
- //alert('You input: ' + value);
- }
- function doSave(value){
- alert('You input: ' + value);
- }
- function doDel(value){
- alert('You input: ' + value);
- }
- // function doSearch(value){
- // alert('You input: ' + value);
- // }
- </script>
用JavaScript方式创建easyUI datagrid Column Group(列组)的更多相关文章
- easyui datagrid Column Group 列组、 复杂表头 嵌套表头 组合表头 (转载)
核心: rowspan:2 //占两行 colspan:3 //占三列 所有的colspan下的二级列表头,统一放在一个数组里. 文章一: 转载来源:https://blog.csdn.ne ...
- 完美实现保存和加载easyui datagrid自定义调整列宽位置隐藏属性功能
需求&场景 例表查询是业务系统中使用最多也是最基础功能,但也是调整最平凡,不同的用户对数据的要求也不一样,所以在系统正式使用后,做为开发恨不得坐在业务边上,根据他们的要求进行调整,需要调整最多 ...
- (转)扩展jquery easyui datagrid 之动态绑定列和数据
本文转载自:http://blog.csdn.net/littlewolf766/article/details/7336550 easyui datagrid 不支持动态加载列,上次使用的方法是自己 ...
- Easyui Datagrid相同连续列合Demo之三
效果图: html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> < ...
- 扩展-Easyui Datagrid相同连续列合并扩展(一)
一.autoMergeCellAndCells实现效果 调用方法: function onLoadSuccess(data){ $(this).datagrid("autoMerge ...
- EasyUI DataGrid 相同连续列合并
扩展方法:$.extend($.fn.datagrid.methods, { autoMergeCells: function(jq, fields) { return jq.each(functio ...
- DataGrid Column Group (合并表头)
<thead> <tr> <th colspan=">swjg</th> <th colspan=">swbm</ ...
- easyui datagrid自定义操作列
通过formatter方法给Jquery easyui 的datagrid 每行增加操作链接 我们都知道Jquery的EasyUI的datagrid可以添加并且自定义Toolbar, 这样我们选择一行 ...
- easyui datagrid自定义按钮列,即最后面的操作列(转)
做项目的时候因为需求,要在表格的最后添加一列操作列,easyUI貌似没有提供这种功能,不过没关系,我们可以自定义来实现 版本:jQuery easyUI 1.3.2 这里我的实现方式是采用HTML形式 ...
随机推荐
- 10分钟,解决卖点没创意的难题zz
创意”,是一个广告人引以为豪又十分头疼的词.有时候,创意来了怎么都挡不住,思如泉涌:有时候,想破脑壳都想不出符合卖点的创意.而笔者告诉我们,有一个方法能轻松解决这个难题. 思路+灵感 问你一个问题:假 ...
- GoogleFusionTablesAPI初探地图与云计算
http://developer.51cto.com/art/200906/129324.htm http://yexiaochai.iteye.com/blog/1893735 http://yex ...
- nginx的源代码分析--间接回调机制的使用和类比
nginx使用了间接回调机制.结合upstream机制的使用来说明一下,首先明白几个事实: 1)事实上ngxin和下游client的连接使用的是ngx_http_connection_t,每一个连接相 ...
- PHP 7.1.5编译安装
1. 安装基础组件 yum install -y libxml2 libxml2-devel bzip2 bzip2-devel curl-devel libjpeg libjpeg-devel li ...
- C++代码书写模板 -- 如何判断函数类型
先说一个简单的方案. 经过验证 g++ 和 vs2010 都可以.原理就是利用函数类型可以直接转换成函数指针. template<class T> bool test( T * t ) { ...
- 九度OJ 1116:加减乘除 (基础题)
时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:1466 解决:902 题目描述: 根据输入的运算符对输入的整数进行简单的整数运算. 运算符只会是加+.减-.乘*.除/.求余%.阶乘!六个运 ...
- ArcGIS10和ArcGIS10.1关于AO Licence初始化的问题
两个版本主要是esriLicenseProductCode.esriLicenseProductCodeArcInfo和esriLicenseProductCode.esriLicenseProduc ...
- Raspberry Pi3 ~ C语言控制串口
注明出处:http://www.cnblogs.com/einstein-2014731/p/5551846.html 使用C语言控制树莓派3B的串口,实现使用串口收发数据的目的.之前以为这个串口是被 ...
- alsa 编程
ALSA(Advanced Linux Sound Architecture)是由内核驱动,标准的API库和一系列实用程序组成.因为涉及到版权和BUG的问题Linux 2.6内核抛弃了旧的OSS,AL ...
- 找到bashrc
(1)直接sudo gedit ~/.bashrc就可以了,编辑完后关闭就行 (2)主文件夹下ctrl+h就能找到.bashrc文件 之所以要找到bashrc文件,是为了把命令 source /opt ...