jqGrid:
参照网址：官网地址http://www.trirand.com/
http://blog.mn886.net/jqGrid/（快速获取demo）
http://www.guriddo.net/demo
https://blog.csdn.net/wubing986496779/article/details/45217557
https://blog.csdn.net/zsq520520/article/details/53375073 （快速查看参数列表及定义）
https://www.cnblogs.com/FlightButterfly/p/4030636.html
https://blog.csdn.net/cilwfvip/article/details/20218333
jqGrid是一款处理表格展现的jQuery插件，支持分页、滚动加载、搜索、锁定、拖动等一系列对表格的常规操作。
jqGrid采用了jQueryUI的CSS主题,因此需要引入jQueryUI的主题CSS。
- 基本使用
- jsonReader （json解读规则）
- userData
- 排序sort
- 多选select,获取数据
- 分页
- prmNames&postData （发送数据）
- colModel
- 导航
内部数据获取修改参见【方法】
事件绑定和触发参见【事件】
主从数据，折叠数据参见【高级】：
http://blog.mn886.net/jqGrid/
后面用到了再细写这部分。
基本使用：
html引入jqGrid文件：
<!-- jqGrid组件基础样式包-必要 --> <link rel="stylesheet" href="../jqgrid/css/ui.jqgrid.css" /> <!-- jqGrid主题包-非必要 --> <!-- 在jqgrid/css/css这个目录下还有其他的主题包，可以尝试更换看效果 --> <link rel="stylesheet" href="../jqgrid/css/css/redmond/jquery-ui-1.8.16.custom.css" /> <script type="text/javascript" src="../js/jquery1.4.2.js" ></script> <script type="text/javascript" src="../js/jquery.jqGrid.src.js" ></script> <!-- jqGrid插件包-必要 --> <script type="text/javascript" src="../jqgrid/js/jquery.jqGrid.src.js"></script> <!-- jqGrid插件的多语言包-非必要 --> <!-- 在jqgrid/js/i18n下还有其他的多语言包，可以尝试更换看效果 --> <script type="text/javascript" src="../jqgrid/js/i18n/grid.locale-cn.js"></script>
html页面上设置table和page：
<table ></table> <div ></div>
在js中填写，最基础调用：
var $table = $("#myGrid").jqGrid({
url:'gridJson.json', //url,获取数据
datatype:'json', //请求数据返回的类型。可选json,xml,txt，此处的datatype要用小写，原src中用的是datatype,而demo中dataType导致demo运行出错
mtype:'get', //默认为get,也可用post如果，post出现500错误，请换成get
colNames : ['编号', '姓名', '性别'],
rowNum: 2, //默认为20行
rowList: [2,10,20,30,50], //用于选择展示的行数
rownumbers: true, //设置行号显示[name=rm]
colModel:[
{name:'code',index:'code',align:'center',width:200,sortable:true},
{name:'name',index:'name',align:'center',width:200,sortable:true},
{name:'gender',index:'gender',align:'center',width:200,sortable:true}
],
viewrecords : true, //是否显示总条数
sortname: 'id', //默认排序列
sortorder: 'desc', //默认排序规则
pager:"#myPager", //用于对应的page
caption:"TableTest" //标题
});
JsonReader：
jqgrid对json格式有一定的要求，不是随便一个json就可以读取展示的。读取规则即jsonReader.
以gridJson.json为示例文件，要求内部以双引号“”，不能有注释等内容，否则解析json失败
以JsonReader的默认读取方式，json数据格式为以下方式：
{
"page": "1",
"total": "3",
"records": "5",
"rows": [{
"id": "1125",
"cell": ["1125", "张三1", "M"]
},
{
"id": "1126",
"cell": ["1126", "张三2", "W"]
},
{
"id": "1127",
"cell": ["1127", "张三3", "M"]
},
{
"id": "1128",
"cell": ["1128", "张三4", "W"]
},
{
"id": "1129",
"cell": ["1129", "张三5", "M"]
}
],
"userdata":{"userId":"5534","userName":"李四"}
}