Tabulator.js 表元素检索行的索引并作为其他绘图的控制元素

Question

我正在使用制表符包 4.3.0 在网页上工作。 包生成的表将成为其他一些图的控制元素。 为了实现这一点，我在定义表变量时添加了一个 dataFiltered 函数。 但不是获取数据对象中行的顺序，我想找到一种方法来获取过滤表中行的索引。

目前，我稍微搜索了手册并编写了与此类似的代码：

dataFiltered: function(filters,rows){
console.log(rows[0]._row.data)
console.log(rows[0].getPosition(true));
}

但是getPosition总是返回-1，表示在过滤表中没有找到该行。 我还生成了一个demo来展示运行该功能时的真实位置。 通过此链接： https : //jsfiddle.net/Binny92/3kbn8zet/53/ 。

如果有人能帮我解释一下如何获得过滤数据中行的真实索引，以便我可以相应地更新绘图以及为什么我在运行编写的代码时总是得到 -1，我将不胜感激通过这种方式。

另外，我想知道是否有办法在用户对表进行排序时也检索数据。 遗憾的是，使用以下策略的代码没有按照我期望的方式工作，因为它没有对排序操作做出反应，并且在第一次加载页面时不会显示信息。

$('#trialTable').on('change',function(x){console.log("Yes")})

提前谢谢你的帮助。

Answer 1

发生这种情况的原因是因为dataFiltered回调是在过滤行之后但在将它们布置在表上之前触发的，因此当您对它们调用getPosition函数时它们不一定准备好。

您可能会更好地使用renderComplete回调，该回调还将处理表排序时的场景，这将更改行位置。

然后，您可以使用getRows函数传入值"active"作为第一个增加仅返回已通过过滤器的行：

renderComplete: function(){
    var rows = table.getRows("active");
    console.log(rows[0].getPosition(true));
}

在旁注中，我注意到您正在尝试访问_row属性以访问行数据。 按照惯例，下划线属性在 JavaScript 中被认为是私有的，不应访问，因为它会导致系统行为不稳定。

Tabulator 在Row Component上有一组广泛的功能，允许您访问所需的任何内容。 在访问行数据的情况下，有getData函数

var data = row.getData();