如何给jqGrid表格按照字段进行分组

最新推荐文章于 2021-10-15 18:58:28 发布

翱翔天地

最新推荐文章于 2021-10-15 18:58:28 发布

阅读量2.7k

点赞数

分类专栏： JQuery 文章标签： jquery jqgrid

本文链接：https://blog.csdn.net/you23hai45/article/details/72905611

版权

JQuery 专栏收录该内容

222 篇文章 2 订阅

订阅专栏

1、问题场景

（1）利用jqGrid生成表格

（2）表格按照字段name进行分组

2、实现源码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="../css/ui.jqgrid-bootstrap-ui.css" />
		<link rel="stylesheet" href="../css/ui.jqgrid-bootstrap.css" />
		<link rel="stylesheet" href="../css/ui.jqgrid.css" />
		<script src="../js/jquery-1.11.0.min.js"></script>
		<script src="../js/jquery.jqGrid.min.js"></script>
		<script src="../js/i18n/grid.locale-cn.js"></script>
		<script>
			$(function(){
				 var mydata = [
		            {id:"1",name:"1号"},
		            {id:"2",name:"2号"},
		            {id:"3",name:"3号"},
		            {id:"4",name:"1号"},
		            {id:"5",name:"2号"},
		            {id:"6",name:"3号"},
		            {id:"7",name:"1号"},
		            {id:"8",name:"2号"},
		            {id:"9",name:"3号"}
		          ];
				
				jQuery("#column").jqGrid({
		            data: mydata,
		            datatype: "local",
		            height: 'auto',
		            rowNum: 30,
		            rowList: [10,20,30],
		            colNames:['编号','名称'],
	                colModel:[
	                    {name:'id',index:'id', width:300, sorttype:"int"},
	               		{name:'name',index:'name', width:900,editable:true}
	             	],
	             	pager: "#columnPager",
	             	viewrecords: true,
	             	sortname: 'name',
	             	grouping:true,
	             	groupingView : {
	               		groupField : ['name']
	             	},
	             	caption: "分组"
		        });
			});
		</script>
	</head>
	<body>
		<div>
			<table id="column"></table>
			<div id="columnPager"></div>
		</div>
	</body>
</html>

3、问题说明

（1）jqGrid分组需要添加两个属性

grouping:true,
groupingView : {
    groupField : ['name']
}

（2）groupField里的内容是分组的字段名

翱翔天地

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
2
评论
如何给jqGrid表格按照字段进行分组

1、问题场景（1）利用jqGrid生成表格（2）表格按照字段name进行分组2、实现源码 $(function(){ var mydata = [ {id:"1",name:"1号"}, {id:"2",name:"2号"},
复制链接

扫一扫

专栏目录