时间戳

首页 > 解决方案 > Tabulator.js：单击复选框时不会触发 cellClick 回调

javascript - Tabulator.js：单击复选框时不会触发 cellClick 回调

问题描述

我需要在recal复选框选中一行后调用来重新计算表格。如果通过单击行调用recal工作来选择它。我从插件站点复制了以下代码

  {formatter:"rowSelection", titleFormatter:"rowSelection", hozAlign:"center", headerSort:false, cellClick:function(e, cell){
    console.log("table ",table);
     // cell.getRow().toggleSelect();
    console.log("table ",table);        
    table.recalc();
  }},

但什么都没有被执行。该复选框被选中并突出显示该行。你可以试试我的jsFiddle。

更新 1 因此，如果我单击复选框，它会起作用，但我希望在单击复选框时触发该功能。

标签： javascripttabulator

解决方案

顾名思义cellClick，应该在单元格元素单击时调用另一个元素，该元素被认为是单元格，并且复选框包含在单元格内，这就是为什么cellClick单击复选框时不触发而在复选框外单击时触发的原因

  1. 问题
    正如@EugeneOlisevich 所建议的，而不是听cellClick，听rowSelectionChanged会是更好的选择。

    在第一次加载完成之前，不会创建使用tableto call recalcas reference 来代替。table

    您可以访问recalc功能的另一种方法是通过this

...
rowSelectionChanged: function(e, row) {
    this.recalc();
},
...
  1. 问题
    当您单击可编辑列时，如果选择了行，那么它将取消选择
    可以通过防止通过功能event冒泡到父级来解决的行。cellClick
...
{
    title: "mn",
    field: "mn",
    editor: "number",
    cellEdited: function(cell) {
        aktualizuj_m(cell);
    },
    cellClick: function(e, cell) {
        e.preventDefault();
        e.stopPropagation();
    },
},
...
  1. 问题
    由于table在第一次加载时未创建参考，因此我添加了条件以在table参考为undefined/之前不运行循环null
table && values.forEach(function(value, index) {
    var row = table.getRow(index + 1);
    if (row.isSelected() && value) {
      calc = calc + value;
    }
});
  1. 问题
    如果将mn列输入更改为 0，则 sum 不会更新，这可以通过更新条件来解决。
...
if (typeof mnozstvi == "number") {
    cell.getRow().update({
      cena_m: cena * mnozstvi
    });
}
...

注：负数范围可在mn列中输入

这里的工作示例

推荐阅读