1.先引入jqgrid的js文件,
<script type="text/javascript"
src="${ctx}/common/jqgrid/js/jquery.jqGrid.src.js"></script>
2.jqGrid的使用方法如下:
(一),html文件加入一个表格table标签:table
<table style="width: 100%; height: 100%; overflow-x: hidden; overflow-y: hidden; padding-top: 3px" id="list2"></table>
(二),在使用jqGrid的具体方法:
jQuery("#list2")//
.jqGrid(//
{
url : WWWROOT+ "/sys/userMgr/loadUsersExceptAuthorizes?defaultOrgId="+OrgId+"&sysId="+sysId,// 组件创建完成之后请求数据的url
shrinkToFit : true,
utowidth : true,//
height : "100%",//
datatype : "json",// 请求数据返回的类型。可选json,xml,txt//
colNames : ['userId', '用户姓名', '登录账号', '性别', '公司', '部门' ],// jqGrid的列显示名字 //
colModel : [ // jqGrid每一列的配置信息。包括名字,索引,宽度,对齐方式..... //colNames和colModel的列是相对应的
{name : 'userId',width : 55,hidden:true},//这一列对应到colNames的userId列
{
name : 'userName',width : 55}, {//后台返回的json数据中的userName显示到colNames的用户姓名这一列的
name : 'account',
width : 55,
align : "center"
}, {
name : 'sex',
width : 55,
edittype : 'select',
formatter : 'select',
editoptions : {
value : "true:男;false:女"
},
lign : "center"
}, {
name : 'userOrgNames',
width : 55,
align : "center"
}, {
name : 'userOrgDepNames',
width : 55,
align : "center"
}
],
rowNum : 10,// 一页显示多少条
rowList : [ 10, 20, 30 ],// 可供用户选择一页显示多少条
pager : '#pager2',// 表格页脚的占位符(一般是div)的id
multiselect : true,
/*
* sortname : 'OrgID',//初始化的时候排序的字段 sortorder :
* "desc",//排序方式,可选desc,asc
*/mtype : "post",// 向后台请求数据的ajax的类型。可选post,get
caption : "用户列表"// 表格的标题名字
});