jqgrid 翻页记录选中行

简单的jqgrid列表

$("#list").jqGrid({
        url:contextPath + "/getList",
        postData: data,
        datatype:"json",
        colNames : [ ‘用户名‘,‘密码‘],
        colModel : [ {
            name : ‘name‘,
            index : ‘name‘,
            align : ‘center‘
        }, {
            name : ‘psw‘,
            index : ‘psw‘,
            align : ‘center‘
        }],
        rownumbers : true,
        viewrecords : true,
        multiselect : true,
        rowNum : 20,
        pager : $(‘#gridPager‘)
    });

分页后每次翻页都会丢掉之前选中行的记录

设置全局变量

var SelectList = []//(用于记录被选中的行)

onSelectAll: function (aRowids, status) {
    if (status) {
        for (var i = 0; i < aRowids.length; i++) {
            if (SelectList.indexOf(aRowids[i]) == -1) {//每一次勾选时,检查该行是否在SelectList中,
                //若在,则在SelectList中删除该记录
                //(翻页也会触发onselect事件,所以需检查该行是否在unselects中)
                SelectList.push(aRowids[i]);
            }
        }
    } else {
        for (var i = 0; i < aRowids.length; i++) {
            if (SelectList.indexOf(aRowids[i]) > -1) {//每一次勾选时,检查该行是否在SelectList中,
                //若在,则在SelectList中删除该记录
                //(翻页也会触发onselect事件,所以需检查该行是否在unselects中)
                SelectList.splice($.inArray(aRowids[i], SelectList), 1)
            }
        }
    }
},
gridComplete: function () {
    var ids = $("#grid-table").jqGrid(‘getDataIDs‘);
    for (var i = 0; i < ids.length; i++) {
        if ((SelectList.indexOf(ids[i]) > -1)) {
            $("#grid-table").jqGrid(‘setSelection‘, ids[i]);
        }
    }
},
onSelectRow: function (rowid, status) {
    if (status) { // 每一次取消选中时,将该行id添加到SelectList中
        if (SelectList.indexOf(rowid) == -1) {//每一次勾选时,检查该行是否在SelectList中,
            //若在,则在SelectList中删除该记录
            //(翻页也会触发onselect事件,所以需检查该行是否在unselects中)
            SelectList.push(rowid);
        }
    } else {
        if (SelectList.indexOf(rowid) > -1) {//每一次勾选时,检查该行是否在SelectList中,
            //若在,则在SelectList中删除该记录
            //(翻页也会触发onselect事件,所以需检查该行是否在unselects中)
            SelectList.splice($.inArray(rowid, SelectList), 1)
        }
    }
},
时间: 2024-10-15 01:09:37

jqgrid 翻页记录选中行的相关文章

jqGrid 翻页

jqGrid的翻页要定义在html里,通常是在grid的下面,且是一个div对象: · <table id="list"></table> ·    <div id="gridpager"></div> · jQuery("#grid_id").jqGrid({ · ... ·    pager : '#gridpager', · ... · }); 不必给翻页设置任何的css属性.在jqGrid里

easyui grid中翻页多选方法

<table class="easyui-datagrid" title="人员选择" id="dg" data-options="singleSelect:false,toolbar:'#toolbar',pagination:false,fit:true, onSelect:function(rowIndex,rowData){ var iflag=0; if(selceids.length<1){ selceids.p

jquery easyui datagrid 在翻页以后仍能记录被选中的行及刷新设置选中行数据

//easyUI的datagrid在复选框多选时,如何在翻页以后仍能记录被选中的行://注意datagrid中需要配置idField属性,一般为数据的主键 $.ajax({ type: 'GET', url:url, async:false, success: function (dt) { var grid = $('#list'); grid.datagrid('reload');//刷新表格数据 grid.datagrid({ onLoadSuccess:function(){ grid.

jqgrid 记录翻页选中数据

项目中有试使用jqGrid 进行数据展示,最近需要完成一个功能 记录用户翻页前选中的数据.如: 目前的分页实现是根据条件加载当前页,前一页的数据并未进行保存,查询API发现没有直接提供处理方法.但API有提供相关处理方法,通过修改能够很容易实现此功能. 实现该功能主要依赖于API提供的三个方法.loadComplete,onSelectAll,onSelectRow     方法名     参数                                          功能 loadCo

jQuery easyUI的datagrid,如何在翻页以后仍能记录被选中的行

1.先给出问题解决后的代码 1 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> 2 <%@ taglib prefix="c" uri="http://java.sun.com/jstl/core_rt"%> 3 <% 4 String path = request.getContextP

Web jquery表格组件 JQGrid 的使用 - 5.Pager翻页、搜索、格式化、自定义按钮

系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件及方法 Web jquery表格组件 JQGrid 的使用 - 5.Pager翻页.搜索.格式化.自定义按钮 Web jquery表格组件 JQGrid 的使用 - 6.准备工作 & Hello JQGrid Web jquery表格组件 JQGrid 的使用 - 7.查询数据.编辑数据.删除数据

JS获得ASP.NET(C#)页面上GridView选中行的信息

做web开发还是新手的我,之前为了得到Gridview中的值,是将其通过服务端控件先将Gridview中的数据保存到服务端,然后绑定当一个服务端的隐藏域,之后通过js读取隐藏域中的值,现在感觉这种方法很笨:虽然得到数据是很容易的仅仅是遍历一下Gridview,但是考虑的性能,我还是想用js来读取.现在可以得到我想要的数据了,为了方便以后和我一样的新手,现在简单记下,希望能够抛砖引玉,有待找到更好的解决办法.如果您有更好的想法请联系qq:643166601,我会及时记录更新. 1.准备数据库,我的

【jqGrid】翻页获取选中的值

1.实现效果: 点击确定所选按钮之后,获取翻页选中的题库表号 2.关键代码 onSelectAll: function (aRowids, status) { }, onSelectRow: function (aRowids, status) { } jQuery("#questionindex_table").jqGrid({ url: '2safety/exam/questionfile/ashx/list.ashx?act=list', datatype: "json

vue table中使用多选的问题(翻页后如何保存已选项),联动echarts图表实现流量监控

流量监控项目需求: 根据表格数据,添加多选功能,默认全选,根据已选项更新图表视图 1.表格需要多选 2.要联动图表,所以关键是要利用表格多选的触发回调函数 vue table中使用多选: 很简单,只需要在table中增开一项,type定义为selection即可: 如何默认列表全选呢? 先关联table: 数据加载完成以后,获取列表数据长度,手动循环切换状态(toggleRowSelection是关键,通过这个方法来触发echarts的刷新): OK,现在可以实现默认全选状态了: 如何与echa