最近一段时间一直在使用jqgrid这个免费的插件,网上的资料也比较多、比较全,但是这里还是整理几个自己在开发过程中遇到的小问题。

1.自动换行

  一行数据过多需要自动根据内容换行时,如果遇到在表格中的汉字换行或者空格换行的问题,可以在style标签中插入下面代码:

 .ui-jqgrid tr.jqgrow td
{
white-space: normal !important;
height:auto;
vertical-align:central;
padding-top:2px;
}

如果遇到一长串的英文单词,需要在英文单词内部换行(非空格处)问题时,可以在style标签中插入下面代码:

td {word-wrap:break-word ; }

2.触发jqgrid表格重载事件

(1)不带参数的重载,其js代码如下

$("#list").trigger("reloadGrid");

(2)触发表格重载时可以带参数,其js代码如下:

$("#list").jqGrid('setGridParam',{url:"192.168.1.1/web?param1="+param1+"&param2="+param1+"&param3="+param3}).trigger("reloadGrid");

3.动态隐藏/显示列

  jqgrid提供API可以动态隐藏某些列,其js代码如下:

$('#list').jqGrid('setGridParam').jqGrid('hideCol',['col1','col2','col3']);

jqgrid同时提供API可以动态显示某些列,只要将上述代码中的'hideCol'换成'showCol'即可。

4.隐藏水平滚动条

  js代码如下:

$("#list").closest(".ui-jqgrid-bdiv").css({ 'overflow-x' : 'hidden' });

5.多层分组显示

  jqgrid提供了分组显示功能(group),其实这个可以用来多层分组,如下面的例子就是先以col1分组后,再分好的结果中再以col2分组

 grouping: true,        //打开分组功能
groupingView : {
groupField : ['col1', 'col2'],
groupColumnShow : [false, false],
groupText : ['<div style="font-size:medium">col1:{0}</div>', '<div style="font-size:medium">col2:{0}</div>'],
groupCollapse : false, //不折叠
groupOrder: ['asc', 'asc'],
groupSummary : [false, false]
},

6.使表头captain内容居中

  js代码如下

 $('#list').closest("div.ui-jqgrid-view")
.children("div.ui-jqgrid-titlebar")
.css("text-align", "center")
.children("span.ui-jqgrid-title")
.css("float", "none");

jQgrid问题总结的更多相关文章

  1. jqGrid合并表头

    jqGrid是一款常用的制表软件,最近开发刚好用到.记录一下常用功能留着以后查找顺便发扬一下开源精神. 二级表头是一种经常会碰到的需求,很多时候为了方便查找需要在原有的表头上再加一层,区分表格不同列的 ...

  2. jqGrid插件getCol方法的一个改进

    jgGrid插件是非常常用的一个基于jQuery的表格插件,功能非常强大.我最近也频繁使用.但是这个插件也有一些不够完善的地方.比如这个getCol方法. getCol方法接受三个参数 colname ...

  3. jqgrid+bootstrap样式实践

    jqgrid+bootstrap样式实践,报错数据加载,选中,删除等功能 需要引入的样式 bootstrap.min.css ui.jqgrid.css 需要引入的JS jquery.min.js b ...

  4. jqGrid jqGrid分页参数+条件查询

    HTML <div class="row"> <div class="col-sm-20"> <form id="for ...

  5. 重复加载同一个jqgrid

    重复加载同一个jqgrid时需要先清除原先的数据,再进行加载新的数据: 清除时使用方法:jQuery.jgrid.gridUnload('jqGridId'); 同时还有一个GridDestroy的方 ...

  6. Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引

    因为内容比较多,所以每篇讲解一些内容,最后会放出全部代码,可以参考.操作中总会遇到各式各样的问题,个人对部分问题的研究在最后一篇 问题研究 里.欢迎大家探讨学习. 代码都经过个人测试,但仍可能有各种未 ...

  7. 五分钟搭建起一个包含CRUD功能的JqGrid表格

    之前的项目也曾用过JgGrid对它的基本功能也是略有了解,网上有个国外的开源的项目,但是不适合个人的风格,所以花了3天空余的时间封装了下JqGrid,也算是参加开发工作10个月以来写的第一个比较完整的 ...

  8. [译]MVC网站教程(四):MVC4网站中集成jqGrid表格插件(系列完结)

    目录 1.   介绍 2.   软件环境 3.   在运行示例代码之前(源代码 + 示例登陆帐号) 4.         jqGrid和AJAX 5.         GridSettings 6.  ...

  9. jqGrid的autoencode参数设置为true在客户端可能引发的编码问题

    不久前使用jqGrid+MVC做过一段时间开发. 一开始,分页参数几乎都是默认值,jqGrid的分页功能很好用. 考虑到each input is evil,我们的系统对安全性又有较高要求,所以,为了 ...

  10. jQuery插件:jqGrid引入及基本属性

    1. jqGrid下载 jqGrid下载地址: http://www.trirand.com/blog/ jqGrid Demo: http://www.guriddo.net/demo/guridd ...

随机推荐

  1. Android 基础(设备显示密度/图片自适应

    1. 设备的 显示密度 是由 设备的尺寸 和 设备的分辨率 两个因素决定的. 相同分辨率设备的尺寸越大显示密度越小, 相同尺寸的设备,分辨率越高显示密度越高. 2. 显示密度等级:  160 / 24 ...

  2. 【DELPHI】线程相关

    //准备让线程调用的测试函数 procedure Draw(aCanvas: TCanvas; X,Y: Integer; aCount: Integer = 100000); var i: Inte ...

  3. ScrollBox 响应鼠标滚轮和ComboBox禁止滚动

    procedure TForm1.FormMouseWheel(Sender: TObject; Shift: TShiftState; WheelDelta: Integer; MousePos: ...

  4. Android SDK离线安装方法详解(加速安装) 转

    AndroidSDK在国内下载一直很慢··有时候通宵都下不了一点点,最后只有选择离线安装,现在发出离线安装地址和方法,希望对大家有帮助! 离线安装包下载地址:http://dl.vmall.com/c ...

  5. (转)Mac OS X内核编程,MAC驱动开发资源汇总

    一.Mac  OS  X内核编程开发官方文档: I/O Kit Fundamentals: I/O Kit基础 - Mac OS X系统内核编程 https://developer.apple.com ...

  6. (转载)linux下tar.gz、tar、bz2、zip等解压缩、压缩命令小结

    linux下tar.gz.tar.bz2.zip等解压缩.压缩命令小结 bz2 tgz z等众多压缩文件的压缩与解压方法,需要的朋友可以参考下 1) Linux下最常用的打包程序就是tar了,使用ta ...

  7. Oracle中的USEREVN()

    Oracle中的USEREVN() 1.USEREVN() 返回当前用户环境的信息,opt可以是: ENTRYID,SESSIONID,TERMINAL,ISDBA,LABLE,LANGUAGE,CL ...

  8. Hibernate从入门到精通(六)一对一双向关联映射

    在上次的博文Hibernate从入门到精通(五)一对一单向关联映射中我们讲解了一下一对一单向关联映射,这次我们继续讲解一下与之对应的一对一双向关联映射. 一对一双向关联 与一对一单向关联映射所不同的的 ...

  9. kruskal算法-Pascal

    马上就快要考试了,然而突然发现自己图论已经废了,于是再都打一遍练练手...... const maxn=; maxe=maxn*maxn; type edge=record //edge记录每一条边, ...

  10. 运行windows系统工具命令

    appwiz.cpl 卸载/安装程序  wscui.cpl 操作中心 inetcpl.cpl  查看Internet属性  eventvwr     查看监视消息和疑难解答消息  taskmgr  任 ...