jqGrid 解决分页跳转无效问题

喜欢ヅ旅行 2023-10-05 14:23 38阅读 0赞

#### 问题描述： ####

![20201125193257666.png][]

jqGrid分页按钮为灰色，不能进行分页跳转。

#### 问题分析： ####

//jqGrid初始化
    jQuery("#datagrid").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,
        multiselect: true,//多选
        shrinkToFit: false, //宽度是否自适应
    });
    //jqGrid填充数据
    $('#datagrid')[0].addJSONData(jsonData);

由以上代码可以看出有三种情况导致分页跳转无效。

#### 问题解决： ####

1、jqGrid初始化时需要添加分页跳转（ loadonce）设置。

//jqGrid初始化
    jQuery("#datagrid").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,
        multiselect: true,//多选
        shrinkToFit: false, //宽度是否自适应
        loadonce: true,//进行分页跳转
    });

2、在jqGrid初始化时填充数据才能分页跳转

//jqGrid初始化
    jQuery("#datagrid").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,
        multiselect: true,//多选
        shrinkToFit: false, //宽度是否自适应
        data: jsonData//填充数据
    });

3、 使用addJSONData()方法填充数据时，数据要变成jqGrid的格式。

后台返回数据格式：

jsonData=eval("{\"page\": \"" + 0 + "\", \"total\": \"" + 4 + "\",\"records\":\"" + 200 + "\", \"rows\": " + data + "}");

page代表页号 ,total为总页数，records为总记录数，rows为要显示的json数据。

//jqGrid填充数据
    $('#datagrid')[0].addJSONData(jsonData);

[20201125193257666.png]: https://img-blog.csdnimg.cn/20201125193257666.png

发表评论取消回复

表情：

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

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

相关阅读

相关 jqGrid 解决分页跳转无效问题

问题描述： ![20201125193257666.png][] jqGrid分页按钮为灰色，不能进行分页跳转。问题分析： //jqGrid初始化

喜欢ヅ旅行/ 2023年10月05日 14:23/ 0 赞/ 39 阅读

相关【JqGrid】JqGrid使用后台分页+查询条件+排序

最近做项目时要用到jqGrid,先学习了一下jqGrid的使用方法，现总结如下，先从基本的说起： 1、数据显示： jqGrid可以解析的数据有很多种，如xml、js

比眉伴天荒/ 2022年07月14日 06:20/ 0 赞/ 697 阅读

相关【JqGrid】JqGrid前端分页+排序+查询条件

jqGrid 是一个用来显示网格数据的jQuery插件，通过使用jqGrid可以轻松实现前端页面与后台数据的ajax异步通信。页面代码如下： <%@ page l

╰+攻爆jí腚メ/ 2022年07月14日 06:18/ 0 赞/ 356 阅读

相关 jqGrid的分页

jqGrid的分页原创 2015年12月17日 14:37:44 标签： [JAVA][] / [jqgrid][] / [分页][Link

「爱情、让人受尽委屈。」/ 2022年05月28日 04:44/ 0 赞/ 240 阅读

相关 jqGrid jqGrid分页参数+条件查询

HTML ![复制代码][copycode.gif] <div class="row"> <div class="co

客官°小女子只卖身不卖艺/ 2022年05月28日 04:39/ 0 赞/ 280 阅读

相关 jqGrid分页查询出错

$("jqGrid").jqGrid('setGridParam',{ page:0 }).trigger("reloadGrid"); 今

淩亂°似流年/ 2022年02月26日 08:12/ 0 赞/ 200 阅读

相关解决Springmvc工程跳转controller无效问题

在实际搭建Springmvc工程，通过controller进行业务处理和逻辑跳转，经常发现接口URL拼写正确但是访问不到控制层，这里给出两点说明，可供排查：

小咪咪/ 2022年02月14日 00:55/ 0 赞/ 290 阅读

相关 laravel 编辑后跳转回分页

进入edit页面时将分页地址保存在session中，更新后跳转该地址 public function edit(Food $food) {

r囧r小猫/ 2021年12月10日 13:31/ 0 赞/ 477 阅读

相关 jqgrid分页

参考： [http://www.poluoluo.com/jzxy/201111/146943.html][http_www.poluoluo.com_jzxy_201111

曾经终败给现在/ 2021年11月11日 03:10/ 0 赞/ 370 阅读

相关 wx.navigateTo跳转首页无效

问题: 首页A—B,B—C,C—A(回首页无效) 先来看首页,首页是由tabBar中三个页面组成再来看下首页的代码组成 //只保留核心代码 "tabBar":

女爷i/ 2021年08月14日 02:45/ 0 赞/ 427 阅读