jq-Grid 能折叠的表格
有一个需求是需要用
jq-Grid展示一个可以折叠的表格,并且要求在页面初始化的时候就将表格折叠起来,我看了一下文档可以给列表增加toolbar: [true, "top"],caption:"标题",可以实现,需要每次点击页面之后列表默认是展开的
gridComplete: function () {
$("#newjqGrid").closest("#gview_newjqGrid").css({"overflow-x": "hidden"})
$("#newjqGrid").closest(".ui-jqgrid-bdiv").css({"overflow-x": "hidden"});
if ($("span.ui-jqgrid-headlink").hasClass("glyphicon-circle-arrow-up")) {
$("span.ui-jqgrid-headlink").removeClass("glyphicon-circle-arrow-up").addClass("glyphicon-circle-arrow-down")
}
},
通过改变类名后,列表第一次会折叠,第二次失效,于是我又想到给元素添加点击事件,
gridComplete: function () {
$("#newjqGrid").closest("#gview_newjqGrid").css({"overflow-x": "hidden"})
$("#newjqGrid").closest(".ui-jqgrid-bdiv").css({"overflow-x": "hidden"});
if ($("span.ui-jqgrid-headlink").hasClass("glyphicon-circle-arrow-up")) {
$("span.ui-jqgrid-headlink").trigger("click")
}
},
这样还是达不到预期的效果,我在想是不是发生冒泡,所以没达到预期的效果,于是在if判断里面加了 return false 仍然达不到效果,于是我在切换元素类名的时候同时触发点击事件,最终达到预期的效果
gridComplete: function () {
$("#newjqGrid").closest("#gview_newjqGrid").css({"overflow-x": "hidden"})
$("#newjqGrid").closest(".ui-jqgrid-bdiv").css({"overflow-x": "hidden"});
if ($("span.ui-jqgrid-headlink").hasClass("glyphicon-circle-arrow-up")) {
$("span.ui-jqgrid-headlink").removeClass("glyphicon-circle-arrow-up").addClass("glyphicon-circle-arrow-down")
$("span.ui-jqgrid-headlink").trigger("click")
return false
}
},
jq-Grid 能折叠的表格的更多相关文章
- easyui 折叠数据表格使用
因为要用到折叠数据表格 但是官网上的例子不能展示 费了好大劲 走了很多弯路 现在能显示出数据 以前大多都是看别人写的文章 自己解决问题的时候几乎没记录过 现在想想真不是好习惯 特此记录分享出来 有需要 ...
- WPF中Grid实现网格,表格样式通用类
/// <summary> /// 给Grid添加边框线 /// </summary> /// <param name="grid"></ ...
- WPF中Grid实现网格,表格样式通用类(转)
/// <summary> /// 给Grid添加边框线 /// </summary> /// <param name="grid"></ ...
- jQuery treetable【表格多重折叠树功能及拖放表格子元素重新排列】
今天有个表格需求做到多重折叠子元素功能,仔细想了下实现原理, 1.在html中,把父子节点的关系写在自定义属性,但对于节点是否有孩子(hasChild),是否是最后一个节点(isLastOne),是否 ...
- ExtJs 学习之开篇(三)Ext.grid.Panel表格中的处理
Ext.grid.Panel Ext.create('Ext.grid.Panel',{ title:'测试表格', width:400, height:20 ...
- easyui源码翻译1.32--TreeGrid(树形表格)
前言 扩展自$.fn.datagrid.defaults.使用$.fn.treegrid.defaults重写默认值对象.下载该插件翻译源码 树形表格用于显示分层数据表格.它是基于数据表格.组合树控件 ...
- FineUI第十七天---- 表格之扩展列
{ sb.AppendFormat(]); 1.通过表格的SelectedRowIndexArray获得选中行的索引号列表: 2.通过表格的DataKeys(二维数组)获取本行的数据 ...
- 深入浅出ExtJS 第三章 表格控件
3.1 表格的特性简介 >.Ext中的表格功能:包括排序/缓存/拖动/隐藏某一列/自动显示行号/列汇总/单元格编辑等实用功能; >.表格由类Ext.grid.GridPanel定义,继承自 ...
- ExtJS4.2学习(10)分组表格控件--GroupingGrid(转)
鸣谢网址:http://www.shuyangyang.com.cn/jishuliangongfang/qianduanjishu/2013-11-17/179.html ------------- ...
- ExtJs中的Grid具体操作(笔记及心得)
一.基本操作步骤 var cm=new Ext.grid.ColumnModel([ //对列的定义,cm是它的简写,作为真个表格的列模式,需要首先创建的{header:'编号',dataIndex: ...
随机推荐
- 设置view的圆角和阴影
1.设置view圆角 self.backView.clipsToBounds = YES; self.backView.layer.cornerRadius = 6.f; 2.设置view阴影 sel ...
- wireshark作业
1Wireshark基本操作: 1.启动wireshark,正确选择混杂模式,访问任意网站: 2.设置过滤器呈现本地和该网站服务器之间的交互报文: 3.保存抓包结果文件.cap: 4.在作业纸上记录下 ...
- 【vcpkg】使用vcpkg安装库
https://blog.csdn.net/cjmqas/article/details/79282847 使用vcpkg 查看vcpkg支持的开源库列表 执行命令 .\vcpkg.exe searc ...
- (0514)芯王国-志锐-Sd卡高速控制-AXI验证
(1)commit (2)core (3)generate (4)struct 结构体 (5)
- 国产DP4344兼容替代CSM4344 192K双通道输出数模转换芯片
DP4344 是一款完整的 2 通道输出数模转换芯片, 内含插值滤波器.Multi-Bit 数模转换器.输出模 拟滤波器,并支持大部分的音频数据格式.DP4344 基于一个带线性模拟低通滤波器的四阶 ...
- Redis实战(二)Redis 的 RDB 配置和数据恢复
RDB 配置解释 在 redis.conf 文件中,默认有 RDB 持久化配置: save 900 1 save 300 10 save 60 10000复制复制失败复制成功 解释: 这些配置称为检查 ...
- FFmpeg转换直播流格式
mp4转rtsp ffmpeg -re -i 1671680590843.mp4 -vcodec copy -acodec copy -f rtsp rtsp://localhost:8554/liv ...
- python36
无限循环 如果条件判断语句永远为 true,循环将会无限的执行下去,如下实例: 实例 #!/usr/bin/python # -*- coding: UTF-8 -*- var = 1 while v ...
- 通过Container制作Image
1.拉取tomcat镜像 docker pull tomcat docker images 2.根据tomcat镜像创建一个tomcat container docker run -d -it --n ...
- Vue2+Cesium1.9+热力图开发笔记
1.安装cesiumJS.heatmap.webpack插件依赖包: yarn install/npm install "dependencies": { ... "ce ...