环境:
- VS2012
- ASP.NET MVC4
- jTable 2.3.0
我注意到,当分页完成时,先前选择的行消失了..这意味着它们不再被选择。 在 SelectedRows 演示之后,我看到 div 填充了当前所选行中的一些字段。 但是一旦您离开页面,该选择就会丢失。
对现有问题发表了评论 https://github.com/hikalkan/jtable/issues/243
但没有即将推出的解决方案。
在我的小测试中,我选择了一行,然后翻到下一页。 以下事件按此顺序触发:
- loadingRecords -- 方法中没有“data”参数,但可以使用 选择行演示代码获取当前选定的行
- selectionChanged -- 选择行演示中的代码 -> 未选择 行
- recordsLoaded -- 有新数据,但未选择任何内容
同样的问题也发生在排序上[选择丢失],并且触发的事件顺序相同。
现在,我绝不是一个 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);
}
},
关于jquery - jTable 网格如何保持其对分页/排序的选择?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18088997/