jqgrid使用简单记录

我要为id为jqGrid的table使用jqgrid插件。

 1 $("#jqGrid").jqGrid({
 2     url: 'data/test.json',
 3     mtype: "GET",
 4     styleUI : 'Bootstrap',
 5     datatype: "jsonp",
 6     colModel: [
 7         { label: '编号', name: 'OrderID', key: true, width: 75},
 8         { label: '名称', name: 'nameID', width: 150},
 9         { label: '联系方式', name: 'tellId', width: 150},
10         { label: '开户时间', name: 'dateId', width: 150},
11         { label:'经理名称', name: 'canaId', width: 150}
12     ],
13     viewrecords: true,
14     rowList:[10,20,50,100],//下拉框选项
15     // autowidth:true,//改变时调用setGridWidth
16     shrinkToFit: true,//自适应列宽
17     height:400,//高度
18     rowNum: 20,//初始化每页数据
19     multiselect: true,//多行选择
20     pager: "#jqGridPager"
21  });

jqgrid使用基本形式

对jqgrid使用中的基本操作，

获取选中行id，如果你选择了多行，那下面的selrow是最后选择的行的id

var selrow=$("#jqGrid").jqGrid('getGridParam',"selrow");

如果想要获取选择多行的id，那这些id便封装成一个selrows数组

var selrows=$("#jqGrid").jqGrid('getGridParam',"selarrrow");

获取table的列名，我现在把他放到数组arrLabel里,代码如下：

1   var colMo=$("#"+jqgridid).jqGrid('getGridParam',"colModel");//获取table设置的列数组
2   var arrLabel=[];
3   for(var i=0; i<colMo.length;i++){
4     arrLabel.push(colMo[i].label);
5   }
6   console.log(arrLabel)；

获取table各列名的id，我现在把它们放到数组arrName里，对应代码如下：

  var colMo=$("#"+jqgridid).jqGrid('getGridParam',"colModel");//获取table设置的列数组
  var arrName=[];
  for(var i=0; i<colMo.length;i++){
    arrName.push(colMo[i].name);
  }
  console.log(arrName)；

 获取选中行的数据，其中selrow为选中行的id，rowData为获取的行数据，得到的rowData为json数据，对应代码如下

var selrow=$("#jqGrid").jqGrid("getGridParam","selrow"); 
var rowData=$("#jqGrid").jqGrid('getRowData',selrow);
console.log(rowData);

删除选中的多行数据，对应代码：

1 var selrows=$("#jqGrid").jqGrid('getGridParam',"selarrrow");
2 for(var i=selrows.length-1;i>=0;i--) {  
3     $("#jqGrid").jqGrid("delRowData", selrows[i]);
4 } 

 

转载于:https://www.cnblogs.com/coyote/p/5893157.html