前言:项目需要用到表格插件,本来觉得jquery datatable样式不错,后台发现没有继承checkbox等问题,最终转而使用jqgrid。
项目语言及架构:java spring mvc
1、jqgrid的创建:
jar包地址:http://pan.baidu.com/s/1nutFNvz 密码:i7ka
2、html代码
- <div id="jqgrid-wrapper">
- <table id="mygrid" class="table table-striped table-hover">
- <tr>
- <td></td>
- </tr>
- </table>
- <div id="jqgrid-pager"></div>
- </div>
3、js代码
3.1、初始化
- $('#mygrid').jqGrid({
- url : '${pageContext.request.contextPath}/cus/xxx.do',
- postData:{'menuId':$('#menuId').val(),'type':$('#type').val()},
- mtype : "POST",
- contentType : "application/json",
- datatype : "json",
- colModel : [ {
- label : '选择',
- name : 'id',
- key : true,
- hidden : true
- }, {
- label : '名称',
- name : 'name'
- }, {
- label : '描述',
- name : 'remark'
- }, {
- label : '创建时间',
- name : 'createTime'
- } ],
- height : '100%',
- pager : 'jqgrid-pager',
- page : "${page}", //初始化查询页数
- rowNum : "${rows}",
- rowList : [ 10, 20, 30 ],
- sortname : 'createTime',
- sortable : true,
- sortorder : 'desc',
- jsonReader : {
- root : "formList", // json中代表实际模型数据的入口