jqGrid 实现分组两种情况（绑定动态数据、绑定本地数据）

「爱情、让人受尽委屈。」 2023-01-02 05:21 237阅读 0赞

### 1 实现分组（绑定动态数据） ###

function initGrid(gridId,colModel){
        jQuery("#"+gridId).jqGrid({
            url:"/loginLog/getLoginLogExtList",
            postData:{},
            datatype: 'json',
            height: $(window).height() - 115,
            width: $(window).width() - 7,
            rownumbers: true, //行号
            pager: "#pager",
            recordtext: "第{0} - {1}条  共 {2} 条",
            pgtext: '当 前 页 {0} 总 共 {1}页',
            rowNum: 50,
            rowList: [50, 100,150],
            autowidth: false,
            viewrecords: true,
            colModel: colModel,
            grouping: true,//开启分组
            groupingView: {
                groupField: ['loginTime'],//要分组的列
                groupColumnShow: [true],//是否显示分组列
                groupText: ['登陆时间：{0}'],//分组前的第一行显示的文字
                groupCollapse: false,//加载数据时是否只显示分组的组信息
            },
        });
    }

### 2 实现分组 （绑定本地数据） ###

有两种数据绑定方法（addJSONData和addRowData）。

function initGrid(,colModel,gridData){
        jQuery("#"+gridId).jqGrid({
            datatype: "local",
            height: $(window).height() - 115,
            width: $(window).width() - 7,
            rownumbers: true, //行号
            pager: "#pager",
            recordtext: "第{0} - {1}条  共 {2} 条",
            pgtext: '当 前 页 {0} 总 共 {1}页',
            rowNum: 50,
            rowList: [50, 100,150],
            autowidth: false,
            viewrecords: true,
            colModel: colModel,
            grouping: true,//开启分组
            groupingView: {
                groupField: ['loginTime'],//要分组的列
                groupColumnShow: [true],//是否显示分组列
                groupText: ['登陆时间：{0}'],//分组前的第一行显示的文字
                groupCollapse: false,//加载数据时是否只显示分组的组信息
            },
        });
        //第一种绑定数据方法
        $('#'+gridId)[0].addJSONData(gridData);
        //第二种绑定数据方法
        //for (var i = 0; i < gridData.length; i++) {
            //$('#'+gridId).jqGrid('addRowData',i+1,gridData[i]);
        //}
    }

发表评论取消回复

表情：

评论列表（有 0 条评论，237人围观）

还没有评论，来说两句吧...

相关阅读

相关 Angular中数据文本绑定、绑定Html、绑定属性、双向数据绑定的实现方式

场景 Angular介绍、安装Angular Cli、创建Angular项目入门教程： [https://blog.csdn.net/BADAO\_LIUMANG\_Q

系统管理员/ 2023年10月07日 13:31/ 0 赞/ 38 阅读

相关 EasyUI combobox（多选下拉框）绑定数据2种方式（动态数据绑定，本地数据绑定）

1 多选下拉框动态数据绑定 function BindMultiListCode(objId,codetype){ $('' + objId).c

曾经终败给现在/ 2023年10月05日 16:42/ 0 赞/ 21 阅读

相关 EasyUI combobox（单选下拉框）绑定数据3种方式（动态数据绑定，本地数据绑定，select标签渲染）

1 单选下拉框动态数据绑定 1.1 数据绑定 function BindListCode(objId,codetype,isshowblank,strReq

た入场券/ 2023年10月05日 14:05/ 0 赞/ 38 阅读

相关 jqGrid 实现排序（绑定动态数据和本地数据）

1 实现排序（绑定动态数据） function initGrid(gridId){ jQuery(""+gridId).jqGrid({

逃离我推掉我的手/ 2023年01月03日 06:14/ 0 赞/ 311 阅读

相关 jqGrid 实现分组两种情况（绑定动态数据、绑定本地数据）

1 实现分组（绑定动态数据） function initGrid(gridId,colModel){ jQuery(""+gridId).jqGr

「爱情、让人受尽委屈。」/ 2023年01月02日 05:21/ 0 赞/ 238 阅读

相关静态绑定、动态绑定

[https://www.cnblogs.com/lizhenghn/p/3657717.html][https_www.cnblogs.com_lizhenghn_p_365

「爱情、让人受尽委屈。」/ 2022年10月17日 13:48/ 0 赞/ 510 阅读

相关 jqGrid绑定Json数据

json： var jsonData = new \{ total = totalPages, page = page, records = totalReco

比眉伴天荒/ 2022年08月30日 04:13/ 0 赞/ 206 阅读

相关 HighCharts实现数据动态绑定（AJAX）

一、HighCharts-下载HighCharts文件包下载地址 [HighCharts7.0.3][HighCharts7.0.3] 如下： ![在这

淡淡的烟草味﹌/ 2022年02月19日 02:15/ 0 赞/ 254 阅读

相关 WPF---数据绑定之PasswordBox绑定

一、概述众所周知，绑定的源既可以是依赖属性也可以是普通的CLR属性，而绑定的目标只能是依赖属性。控件PasswordBox的Password属性不是依赖属性，不

超、凢脫俗/ 2021年11月17日 12:54/ 0 赞/ 660 阅读

相关数据绑定

什么是数据绑定呢？把WXML 中的⼀些动态数据分离出来放到对应的js⽂件的 Page 的 data⾥ <view>{ {username}}，您已登录

布满荆棘的人生/ 2021年07月24日 20:11/ 0 赞/ 544 阅读