Jqgrid入门-Jqgrid分组的实现(八)

最新推荐文章于 2024-11-13 01:18:00 发布

iteye_2783

最新推荐文章于 2024-11-13 01:18:00 发布

阅读量201

点赞数

文章标签： javascript ViewUI

上一章主要说明了如果实现Jqgrid列数据拖动，这一章主要讨论在Jqgrid中如何实现分组功能。

类似于Sql语句的Group By，Jqgrid提供了属性实现数据分组，这样表现数据会显得比较直观。先上个效果图：

从图上我们可以很直观的看出，数据是根据家庭住址分的组，并且能够很直观的看出每个分组里面有多少信息量。要实现这个功能并不难

 
     
          grouping :  
          true 
          , 
          // 是否分组,默认为false 
         
 
          groupingView : { 
         
 
          groupField : [  
          'address' 
          ],  
          // 按照哪一列进行分组 
         
 
          groupColumnShow : [  
          true 
          ], 
          // 是否显示分组列 
         
 
          groupText : [  
          '<b>{0} - {1} 条记录</b>' 
          ], 
          // 表头显示的数据以及相应的数据量 
         
 
          groupCollapse :  
          false 
          , 
          // 加载数据时是否只显示分组的组信息 
         
 
          groupDataSorted :  
          true 
          , 
          // 分组中的数据是否排序 
         
 
          groupOrder : [  
          'asc' 
          ], 
          // 分组后的排序 
         
 
          groupSummary : [  
          true 
          ], 
          // 是否显示汇总.如果为true需要在colModel中进行配置 
         
 
          summaryType :  
          'max' 
          , 
          // 运算类型，可以为max,sum,avg</div> 
         
 
          summaryTpl :  
          '<b>Max: {0}</b>' 
          , 
         
 
          showSummaryOnHide :  
          true 
          //是否在分组底部显示汇总信息并且当收起表格时是否隐藏下面的分组 
         
 
          }, 
         
 
   