1、在你的jqgrid表格tfoot处加合计 开启属性:
footerrow: true,userDataOnFooter: true,
后台传过来的json格式如下,记得对应上字段名
{ ... userData:{ id: "合计", un_covered_area: "159580.84", un_inside_area: "161331.22", dis_area: "-1750.38",… }}
2、固定了列宽后,如何设置横向滚动条?开启属性:
shrinkToFit:false, // 设置滚动条
3、jqgrid增加行号列(两种方法) 第一种是jqgird自带的序号,打开属性开启:
rownumbers: true,
第二种是自己从后台拼装,我这里用的是php:
$current = 0;#组装序号$page = ((int)$map['start'] / (int)$map['length']) + 1;foreach($result as $key => $value) { #组装序号 ++$current; $result[$key]['nowcur'] = $v['nowcur'] = ($page - 1) * $map['length'] + $current;}
4、jqgrid如何去除分页,也仅仅是设置一个选项(后台怎么处理打印便知):
rowNum: 'all',
5、jqgrid开启多选属性:
multiselect: true,
6、jqgrid自适应父容器宽属性:
autowidth: true,
7、Jqgrid类似datatables的render功能(cellvalue是当前值,rowObject是当前行数据对象):
{ name: 'id', index: 'id', width:"20px", sortable: false, //禁止排序 formatter:function(cellvalue, options, rowObject){ return ""; }}, //序号
8、Jqgrid单行选择事件配置(rowid为gridcomplete方法中封装的主键id,而status表示当前行选没选中,您打印下便知啦):
onSelectRow: function (rowid, status){ ...}
9、jqgrid开启多选时如何触发多选事件 如果开启了多选
multiselect: true,
则会触发下面多选事件
onSelectAll: function (rowid, status){ ...}
10、jqGrid重载(参数可重置)
var data = { search: decodeURIComponent($(this).serialize())};
$("#list").setGridParam({ postData: data}).trigger("reloadGrid"); // 重载jqgrid
里面可以设置新的多种配置参数
如果仅仅是刷新表格,那么用下面则会自动带上以前条件重新刷新一遍
$("#list").trigger("reloadGrid");//重载jqgrid
11、jqgrid获取取选中行的值:
第一种(可取出任意单击行字段值)
//得到jqgrid单行选择的行的数据function getGridId(id, sql_name) { var ids = $("#" + id).jqGrid('getGridParam', 'selrow'); var rets = jQuery("#" + id).jqGrid('getRowData', ids); if (rets) { return rets[sql_name] } else { return false; }}
调用如:
console.log(getGridId('list', 'id'));
第二种(取出选定的全部值)
/** * [jqgrip 获取一行信息] * @param param jqgrip表格id * @returns 返回单行表信息 */function jqgrip_get_Row(param){ var model = '#'+param; var rowId = $(model).jqGrid('getGridParam', 'selrow'); // 获取信息的id var rowData = $(model).jqGrid('getRowData', rowId); return rowData;}
开启多选时,取出多行选中值
/** * jqgrip 获取多行信息 * @param param jqgrip表格id * @returns 返回多行表信息 */function jqgrip_get_multiRow(param){ var model = '#'+param; var rowId = $(model).jqGrid('getGridParam', 'selarrrow'); // 获取信息的id var multiRow =[]; for (var i = 0; i < rowId.length; i++) { var res = $(model).jqGrid('getRowData', rowId[i]); multiRow.push(res); } return multiRow;}