3

环境:

  • VS2012
  • ASP.NET MVC4
  • j表2.3.0

我注意到当分页完成时,之前选择的行消失了......这意味着它们不再被选中。在 SelectedRows 演示之后,我看到 div 填充了当前选定行中的一些字段。但是,一旦您离开,该选择就会丢失。

已对现有问题发表评论 https://github.com/hikalkan/jtable/issues/243

但没有即将到来的解决方案。

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

  • loadingRecords -- 方法中没有“数据”参数,但可以使用选择行演示代码获取当前选定的行
  • selectionChanged -- 选择行演示中的代码 -> 没有选定的行
  • recordsLoaded - 有新的新数据,但没有选择任何内容

同样的问题也发生在排序上[选择丢失],并且事件的触发顺序相同。

现在,我绝不是 jQuery 或 Javascript 人。

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

想法/解决方案?

4

2 回答 2

2

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

我的策略是创建一个 $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);
        }
    },
于 2014-04-13T18:34:15.750 回答
0

我认为应该需要以下内容。

  • 即您必须为该列分配一个键。
  • 使用 $(table_id).jtable('reload');

重新加载 - 将保留您的状态记录。

        columnname: {
            key: true,
            list: false,
        },
于 2020-11-18T05:24:09.290 回答