强大的JQuery的插件jqGrid(4)

希望这个帮助文档能对大家学习jQuery的插件jqGrid带来帮助(在个人的使用过程中不断更新),希望大家提出意见。

这段代码是编辑、增加、查找等功能执行的代码，写在url后面方便查找。对于这些定义的功能，每个操作传递过去的editurl是不一样的，oper分别是edit ，add，search、等。之后传递的是操作后，数据变化的参数。

当然，我们很多时候需要自己定义一些事件，jqGrid有一个添加按钮的函数，可以方便的添加我们想要的任何功能按钮

jQuery("#list").navGrid('#pager',

{

refresh: true,

edit: true,

add: true,

del: true,

search: true ,

position:"right"}

).navButtonAdd(

'#pager',

{

caption:"Del",

buttonimg:"/SedSoft/jqGrid/themes/basic/images/folder.png",

onClickButton: function(){ //执行删除行操作

// var gr = jQuery("#list").getGridParam("selarrrow");

var gr=chooseid;

if( gr != null&gr!="" ) {

jQuery("#list").delGridRow(gr,{

afterSubmit: function(xhr,postdata){

alert ('After Submit: ' + postdata);

return [true]},

url: pathname +'/xmlTableEdit?openagent&oper=del' //执行删除代理rul

});

} else {

alert("Please Select Row to delete!");

};},position:"last"

})

上面这段代码就添加了一个删除按钮，并获得选中的id数组，并通过url代理去处理该操作。

事实上，通过.navButtonAdd()函数可以添加任何我们想要的按钮，而该函数里面属性分别定义按钮出现的位置’#pager’,按钮标题字符’caption’，按钮图标路径’buttonimg’,点击按钮的onClickButton事件，在事件里面可以写任何你想要的js代码，以满足你的需求。position属性定义了按钮显示的位置。

除了这种直接添加按钮和事件的方法外，jqGrid还提供了重写和替换部分功能函数的能力。举例编辑功能说明。

四、jqGrid的修改编辑功能

jqGrid定义了三种可以用于修改和编辑表格数据的方法，分别是cellEdit、inline Edit、