当前位置: 首页 > 工具软件 > JGrid > 使用案例 >

jgrid常用的属性和方法

赵景曜
2023-12-01
var id = $("#newstable").jqGrid("getGridParam", "selrow");   //单行
var selectedId = $("#newstable").jqGrid("getGridParam", "selarrrow"); //多行 

jqgrid使用:常用属性用法和含义

1. 如何获取grid选中的行的ID?

Javascript代码
var rowid = $( "#searchResultList" ).getGridParam( "selrow" ); 
var rowid = $("#searchResultList").getGridParam("selrow");

2. 如何在表格中动态增加一行数据? 

Javascript代码
//$("#jqgrid").addRowData(rowId, data, pos, idx); 
//pos可以为[first,last,before,after],为后两者是需要指定相对的行ID 
$( "#jqgrid" ).addRowData( "1" , { "name" : "test" , "age" :12}, "first" ); 
//$("#jqgrid").addRowData(rowId, data, pos, idx);
//pos可以为[first,last,before,after],为后两者是需要指定相对的行ID
$("#jqgrid").addRowData("1", {"name":"test","age":12}, "first");

3. 如何动态修改某行的数据内容,如某几列的值? 

Javascript代码
//setRowData( rowid, data ); 
$( "#jqgrid" ).setRowData( "1" , { tax: "5" , total: "205" }); 
//setRowData( rowid, data );
$("#jqgrid").setRowData( "1", { tax:"5", total:"205" });

4. jqgrid的常用属性? 

Javascript代码
$( "#jqgrid" ).jqGrid({ 
url: "${ctx}/sys/role/search.dm" , 
colNames:[ "角色名称" ], //,"角色代码" 
colModel:[ "roleName" ], //"roleCode"还可以用对象替换 
jsonReader:{id: "roleId" ,root: "dataList" }, 
width:240, 
height:250, 
rowNum:20, //每页20条记录 
pager: "logListPager" , //分页显示的DIVID 
sortname: "actionTime" , //默认排序的列名 
sortorder: "desc" , //默认排序的顺序 
scroll: true , //鼠标滚动翻页 
onSelectRow: function (rowid) {} 
}); 
$("#jqgrid").jqGrid({
url:"${ctx}/sys/role/search.dm",
colNames:["角色名称"],//,"角色代码"
colModel:["roleName"],//"roleCode"还可以用对象替换
jsonReader:{id:"roleId",root:"dataList"},
width:240,
height:250,
rowNum:20,//每页20条记录
pager: "logListPager",//分页显示的DIVID
sortname: "actionTime",//默认排序的列名
sortorder: "desc",//默认排序的顺序
scroll:true,//鼠标滚动翻页
onSelectRow: function(rowid) {}
});

5. 获取某一行的数据对象? 

Javascript代码
var rowid = $( "#searchResultList" ).getGridParam( "selrow" ); 
var rowData = $( "#searchResultList" ).getRowData(rowid); 
var rowid = $("#searchResultList").getGridParam("selrow");
var rowData = $("#searchResultList").getRowData(rowid);

6. 如何使用API动态修改选中的行? 

Javascript代码
//true:重新加载表格数据, false:不重新加载表格数据 
$( "#jqGrid" ).setSelection( "1" , true ); 
//true:重新加载表格数据, false:不重新加载表格数据
$("#jqGrid").setSelection("1", true);
7.如何获取某一列的值

Javascript代码

var col= jQuery("#jqGrid ").jqGrid('getCol',4,false);//获取第4列的值

var col= jQuery("#jqGrid ").jqGrid('getCol','name',false);//获取列名为name的列的值

8.如何删除一行或多行

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


还有以下常用的API,

Javascript代码
$( "#jqgrid" ).resetSelection(); 
$( "#jqgrid" ).clearGridData(); 
$( "#jqgrid" ).setCell(rowid,colname,nData,cssp,attrp); 


 

 类似资料: