jqGrid multiselect，复选框在移动到下一页时保持不变

如果您看到jqGrid演示：

部分：高级-->多选

当我移动到下一页时，您将看到选中的复选框不会持久化，并且 再次返回上一页

如何让它持续下去

这是我的方案，在我的应用程序中有一个组功能，我可以 添加几个客户，我使用jqgrid显示数千个客户

我想检查我想要的每个客户，然后提交所选客户并将其添加到指定的组中

我该怎么做？（使jqgrid、multiselect持久化？）

---

谢谢

查看此处的事件列表

逻辑是：

---

每次触发“onPaging”事件时，您都应该遍历每一行，并将每一行的唯一id存储到一个数组中，同时遍历id数组，并在每次触发“onPaging”事件时选中所有的选择框。

我使用这些函数在

jqGrid

调用中设置了以下三个选项：

onSelectRow: HandleSelectRow,
onSelectAll: HandleSelectAll,
gridComplete: HandleSelectedIds,

我的函数如下所示：

function HandleSelectRow(id, selected)
{
    // Did they select a row or de-select a row?
    if (selected == true)
    {
        var currIndex = SELECTEDIDS.length;
        //selected_jq_ids_array[currIndex] = id;
        SELECTEDIDS.push(id); //SELECTEDIDS is a global variable I defined.
    }
    else
    {
        // Filter through the array returning every value EXCEPT the id I want removed.
        SELECTEDIDS = $.grep(SELECTEDIDS, function(value)
        {
            return value != id;
        });
    }
}

下一个：

function HandleSelectAll(id, selected)
{
    // Did they select or deselect?
    if (selected == true)
    {
        for (single_id in id)
        {
            // If the value is NOT in the array, then add it to the array.
            if ($.inArray(id[single_id], SELECTEDIDS) == -1)
            {
                SELECTEDIDS.push(id[single_id]);
            }
        }
    }
    else
    {
        for (single_id in id)
        {
            // If the value is in the array, then take it out.
            if ($.inArray(id[single_id], SELECTEDIDS) != -1)
            {
                SELECTEDIDS = $.grep(SELECTEDIDS, function (value)
                {
                    return value != id[single_id];
                });
            }
        }
    }
}

最后一点：

function HandleSelectedIds()
{
    if (SELECTEDIDS != null)
    {
        currentGridIds = new Array();
        currentGridIds = $("#lookupControl").getDataIDs();

        //Make Selection
        for (var e = 0; e < currentGridIds.length; e++)
            for (var i = 0; i < SELECTEDIDS.length; i++)
                if (SELECTEDIDS[i] == currentGridIds[e])
                    jQuery("#lookupControl").setSelection(SELECTEDIDS[i], false);

        // TODO: Some logic on if all the rows on the current page are selected, then make sure to check the "Select All" checkbox.
        //var selectedIds = $("#lookupControl").getGridParam('selarrrow');  
    }
}

函数handleselecteds（）
{
if（selectedds！=null）
{
currentGridIds=新数组（）；
CurrentGridId=$（“#lookupControl”）.GetDataId（）；
//挑选
对于（var e=0；e

没有通过jqgrid直接保留复选框值的方法，相反，我们可以创建一个新列来保留复选框值。请参见下面链接中的演示

使用gridComplete和onPaging事件加上jquery.data（）方法，这是相当简单的。这比我在网上看到的很多东西要简单得多，所以我想我会分享它。“我的网格”的选择器为“#employeerolegrid”

       gridComplete: function () {

            var currentPage = $(this).getGridParam('page').toString();

            //retrieve any previously stored rows for this page and re-select them
            var retrieveSelectedRows = $(this).data(currentPage);
            if (retrieveSelectedRows) {
                $.each(retrieveSelectedRows, function (index, value) {
                    $('#employeerolegrid').setSelection(value, false);
                });
            }
        },
        onPaging: function () {
            var saveSelectedRows = $(this).getGridParam('selarrrow');
            var page = $(this).getGridParam('page') - 1;

            //Store any selected rows
            $(this).data(page.toString(), saveSelectedRows);
        }

我的解决方案：（定义变量current_page并在Event loadBeforeSend中设置）因为

函数获取多选值数组

function getSelectedValues(){

    var saveSelectedRows = $("#YourGrid").getGridParam('selarrrow');

    $("#YourGrid").data(current_page, saveSelectedRows);

    var retrieveSelectedRows = $("#YourGrid").data();       

    var arr_values = new Array();

    if (retrieveSelectedRows) {
        $.each(retrieveSelectedRows, function (index, value) {
            $.each(value, function (index, sub_value) {
                if(typeof(sub_value)=='string')
                arr_values.push(sub_value);
            });
        });
    }

    return arr_values;
}

我发现：

    onSelectRow: function (id) {
        var p = this.p, item = p.data[p._index[id]];
        if (typeof (item.cb) === 'undefined') {
            item.cb = true;
        } else {
            item.cb = !item.cb;
        }
    },
    loadComplete: function () {
        var p = this.p, data = p.data, item, index = p._index, rowid;
        for (rowid in index) {
            if (index.hasOwnProperty(rowid)) {
                item = data[index[rowid]];
                if (typeof (item.cb) === 'boolean' && item.cb) {
                    $(this).jqGrid('setSelection', rowid, false);
                }
            }
        }
    },

---

我必须说，它工作得很好。

谢谢你的回答。我已经解决了参考文献2在以下页面中描述的OnSeRow和GridComplete事件的问题：这基本上是有效的，但在返回页面时似乎有一个bug。将onPaging函数更改为：

onPaging:function（a）{var pagerId=This.p.pager.substr（1）；//ger纸张id类似于“pager”var pageValue=$（'input.ui pg input'，“#pg#”+$.jgrid.jqID（pagerId））.val（）；var saveSelectedRows=$（this）.getGridParam（'selarrow'）；//存储任何选定行$（this）.数据（pageValue.toString（），saveSelectedRows）；}，

什么是

LoadRoleTypes（）

？经过一次小的修正后，效果完美。在on paging函数中，我们不需要减少一个。下面的检查：onPaging:function（）{var saveSelectedRows=$（this）.getGridParam（'selarrrow'）；var page=$（this.getGridParam（'page'）；//存储所有选定行$（this）.data（page.toString（），saveSelectedRows）；}

function getSelectedValues(){

    var saveSelectedRows = $("#YourGrid").getGridParam('selarrrow');

    $("#YourGrid").data(current_page, saveSelectedRows);

    var retrieveSelectedRows = $("#YourGrid").data();       

    var arr_values = new Array();

    if (retrieveSelectedRows) {
        $.each(retrieveSelectedRows, function (index, value) {
            $.each(value, function (index, sub_value) {
                if(typeof(sub_value)=='string')
                arr_values.push(sub_value);
            });
        });
    }

    return arr_values;
}

    onSelectRow: function (id) {
        var p = this.p, item = p.data[p._index[id]];
        if (typeof (item.cb) === 'undefined') {
            item.cb = true;
        } else {
            item.cb = !item.cb;
        }
    },
    loadComplete: function () {
        var p = this.p, data = p.data, item, index = p._index, rowid;
        for (rowid in index) {
            if (index.hasOwnProperty(rowid)) {
                item = data[index[rowid]];
                if (typeof (item.cb) === 'boolean' && item.cb) {
                    $(this).jqGrid('setSelection', rowid, false);
                }
            }
        }
    },