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

xiaoxiao2021-02-28  74

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里的内容是分组的字段名

转载请注明原文地址: https://www.6miu.com/read-64856.html

最新回复(0)