var $areaTable = $("#areaTable");
$areaTable.jqGrid({
caption: "全省各地区能耗概要",
colNames : ['id','全省地区','企业数量(家)','节能量当年完成比率(%)','当年能耗(吨标准煤)','操作'],
colModel : [
{name:'areaId',index:'areaId',align : "center", hidden : true},
{name:'areaName',index:'areaName',align : "center", width:175, sortable:false},
{name:'companyCount',index:'companyCount',align:"center", width:60, formatter: "integer", sorttype: 'integer'},
{name:'currentSaving',index:'currentSaving',align:"center", width:145, formatter: "number", sorttype: 'float'},
{name:'currentConsume',index:'currentConsume',align:"center", width:145, formatter: "integer", sorttype:'integer'},
{name:'option', index : 'option', width:50, sortable:false}
],
height: 'auto',
url:"/mvc/myriadcompany/nav/areaOverview",
datatype: "json",
jsonReader:{
root: 'data',
repeatitems: false,
id:'0',
},
gridComplete:function(){
var rows = $areaTable.find("tbody tr");
$(rows).each(function(index, elem){
if (index != 0) {
$(elem).find("td:last")
.addClass("alink jsToAreaDetail")
.attr("title", "查看详情")
.html("查看详情");
}
});
$(".jsToAreaDetail").click(function(){
self.enterAreaPage($(this).parent().attr('id'));
});
},
});
要点:
①colNames 与colModel 数组长度必须一致
②jsonReader属性配置:
root指定返回JSON的数据的根节点;
repeatitems: false 指明返回结果无需按顺序列出各字段的值,甚至无需包含所有的字段, 因为jqGrid是按照colModel 来查找显示各列的.
③各列的数据如果需要特殊处理(如格式化,加超链接等), 可以使用colModel的formmater指定函数.
④如需排序, datatype=json时, 需后台支持 sidx=当前排序列, sord=排序方式asc desc
分享到:
相关推荐
jqGrid没有setComplexGroupHeaders方法,使用此插件实现三级分组表头功能
jqGrid是一个非常好用的免费开源Grid组件,功能强大,适用于各种表格操作,数据管理。作为jquery插件,jqGrid使用方便,简介,美观。
NULL 博文链接:https://only-xxp.iteye.com/blog/768029
jquery.jqGrid-4.8.2(jquery表格插件).zip----------jqGrid4.8.2包,官网下载的,原封不动的在这里。 jqgrid_demo40-----可用的-使用方法请查看README文件. jqgrid_3.6.5_API_en.chm------附加放在这里的其它资料...
jquery.jqGrid-4.6.0(jquery表格插件).zip----------jqGrid4.6.0包,官网下载的,原封不动的在这里。 jqgrid_demo40-----可用的-使用方法请查看README文件.rar-----------经我修改过的demo40,官网上面demo40下载...
网上收藏的 jqGrid中文说明文档——选项设置 挺实用的
jQgrid+demo
最新jqgrid插件
jqgrid jquey 样式 让表格变得更漂亮
jquery jqgrid 插件,方便定义datagrid
Jqgrid最新插件,用于网格数据的排序,查询,字段栏位拖拽,学习之后,网格数据基本没有问题了
JqGrid插件+JqGridDemo+JqGrid主题,自己项目里引入的文件
MVC4网站中集成jqGrid表格插件-示例源代码
jqgrid English a jQuery Plugin by Tony Tomov
C#封装的JqGrid插件,配置相应的即可
jquery.jqGrid-4.3.1+jquery-ui-1.8.17.rar
jQuery 学习之:jqGrid 表格插件 参数配置 4 jqGrid 学习 自定义搜索 14 jqGrid 学习 搜索工具栏 16 jqGrid 学习 搜索 17 jqGrid 学习 自定义格式化类型 19 jqGrid 学习 格式化 21 jqGrid 学习 自定义按钮 26 jqGrid...
MVC4网站中集成jqGrid表格插件-示例源代码,包含基础basecontroller,以及5个controller
关于jqGrid插件中分组功能的一些自己的总结,主要有按某列分组,以及按多列分组
jqGrid增加时--判断开始日期与结束日期(实例代码)。需要的朋友可以过来参考下,希望对大家有所帮助