Jquery 如何使jTable grid在分页/排序时保持其选择?

Jquery 如何使jTable grid在分页/排序时保持其选择?,jquery,asp.net,asp.net-mvc-4,jquery-jtable,Jquery,Asp.net,Asp.net Mvc 4,Jquery Jtable,环境: VS2012 ASP.NET MVC4 JTTable 2.3.0 我注意到,分页完成后,以前选择的行将消失。。这意味着它们不再被选中。 在SelectedRows演示之后,我看到div中填充了当前选定行中的一些字段。 但一旦你翻页,选择就会丢失 对现有问题发表了评论 但没有现成的解决办法 在我的小测试中,我选择了一行,然后翻页到下一页。 按此顺序触发了以下事件: loadingRecords-方法中没有数据参数,但可以使用 选择行演示代码获取当前选定行 selectionChange

环境:

VS2012 ASP.NET MVC4 JTTable 2.3.0 我注意到,分页完成后,以前选择的行将消失。。这意味着它们不再被选中。 在SelectedRows演示之后,我看到div中填充了当前选定行中的一些字段。 但一旦你翻页,选择就会丢失

对现有问题发表了评论

但没有现成的解决办法

在我的小测试中,我选择了一行,然后翻页到下一页。 按此顺序触发了以下事件:

loadingRecords-方法中没有数据参数,但可以使用 选择行演示代码获取当前选定行 selectionChanged-选择行演示中的代码->未选择 排 recordsLoaded-具有新的新数据,但未选择任何内容 同样的问题也发生在触发相同顺序事件的排序[selection is lost]上

现在,我绝不是一个jQuery或Javascript的家伙

但想知道是否有可能创建一个集合类,然后当用户选择一行时, 将该行的键添加到集合中,如果取消选中该行,则将其删除。 在分页时,让loadingRecords更新集合,并在触发selectionChanged时, 收藏中是否有物品;它只是重新选择它们


想法/解决方案?

发现此问题没有答案,然后将此功能添加到网站。所以我分享我所做的,希望它能帮助别人。我认为可能有一些优化可用,所以请随时提供它们作为评论

我的策略是创建一个$colleges数组来存储行键,更新此数组以匹配选择,并在分页活动期间使用此数组选择行。selectionChanged事件仅包括可见行。因此,在这个版本中,我首先从$colleges数组中删除所有可见行,然后添加回所有当前可见和选定的行

            var $colleges;
            ...
            $('#collegeSearchContainer').jtable ({ 
            ...
            fields: {
                uid: { key:true, list:false, edit:false, create:false }
                ...
            },
    selectionChanged: function () {

        var $table = $('#collegeSearchContainer');

        // Get all currently selected rows
        var $selectedRows = $table.jtable('selectedRows');

        // DEL - add all non-visible rows to colnew then swap
        var $colnew = [];
        for (var i = 0, len = $colleges.length; i < len; i++) {
            $row = $table.jtable('getRowByKey', $colleges[i]);
            if (!$row)
                $colnew.push($colleges[i]);
        }
        $colleges = $colnew;

        // ADD - make sure currently selected rows are selected
        if ($selectedRows.length > 0) {
            $selectedRows.each(function () {
                var record = $(this).data('record');
                if ($.inArray(record.uid, $colleges) < 0) 
                    $colleges.push(record.uid);
            });
        }

        // UPDATE selection indicator for colleges
        $('#email_schools').html($colleges.length);         
    },
    rowInserted: function (event, data) {
        // select those colleges that have been selected in the past
        if ($.inArray(data.record.uid, $colleges) >= 0) {
            $('#collegeSearchContainer').jtable('selectRows', data.row);
        }
    },

我认为应该要求以下几点

i、 e您必须为该列分配一个键。 使用$table_id.jtable'reload'; 重新加载-将保留您的状态记录

        columnname: {
            key: true,
            list: false,
        },