jqGrid自定义按钮和汇总问题
1，jqGrid的自定义按钮事件，是在左下角导航栏产生的，
jQuery(grid_selector).jqGrid('navGrid', "#tableId",
{ edit: true,add: true, del: true,view: true},
{
//edit按钮的一些属性
可以增加一些上述四个方法的设置
beforeShowForm: function (e) {}
},{
//add按钮的一些属性
},{...},{...}
//在上述四个方括号后直接调用此方法
.jqGrid('navButtonAdd',pager_selector,{
buttonicon:'icon-globe purple',
caption:'history',
position:'last',
title:'view history',
onClickButton:function(){
debugger;
//获得某行id
var gr = jQuery("#grid-table").jqGrid('getGridParam', 'selrow');
//获得某行数据
var grr = jQuery("#grid-table").jqGrid('getRowData',gr);
if (gr != null) alert("history"+grr.name);
else alert("Please Select Row");
}
})
那么自定义的history按钮就可以了，触发的是查询功能
2,汇总
方法1
jQuery(grid_selector).jqGrid({
//地址
url: "/jqGrid/select.html",
//发送数据
postData: {"stock": $("#stock").val(), "name": $("#lastSales").val(), "note": $("#notes").val()},
//发送方式
mtype: "get",
datatype: "json",
//表格高度
height: 400,
//列名
colNames: [' ', 'ID', 'Last Sales', 'Name', 'Stock', 'Ship via', 'Notes','Amt'],
colModel: [
{name: 'id', index: 'id', width: 60, sorttype: "int", editable: true},
{name: 'sdate', index: 'sdate', width: 90, editable: true, sorttype: "date", unformat: pickDate}}
],
//汇总
footerrow : true,
userDataOnFooter : true
汇总首先要显示出如图中的汇总行，他是最下放突出的一行，需要在方法1里设置两个属性
footerrow : true, userDataOnFooter : true,
然后想要显示total：和总金额1060怎么做呢
1，总金额是 后台代码通过sql自己计算的，然后放到userdate里
以图片为例
| note | amt |
| note1 | 100 |
| note2 | 1050 |
| Totals: | 1060 |
能看到，Totals 显示在note这一列里，总金额显示在amt的这一列里。
所以后台返回的json中，userdate这样设置
userdata:{amt:1060,note:"Totals"}即可