更新另一个单元格的制表符自动完成功能答案

【问题标题】：tabulator autocomplete that updates another cell更新另一个单元格的制表符自动完成功能
【发布时间】：2021-12-14 00:20:34
【问题描述】：

我正在尝试按如下方式使用制表符：

从包含类似于以下项目的数据库中提取一组键->值：

'JohnSmith' -> '名字是 john smith'
'安德鲁史密斯'-。名字是“安德鲁·史密斯”

第 1 列包含从上面的键中提取的“自动竞争”列表。输入说“smith”将允许我选择两个键之一

第 2 列选择正确的选项后，单元格将填充正确的“名称是...”值

我尝试了多种选择，包括：

在自动完成单元格上使用“cellEdited”回调
添加一个更新第二个单元格的修改器
向格式化程序添加 onrendered 函数

我怀疑我只是通过 javascript 遗漏了一些东西，但希望有人能指出我正确的方向。

【问题讨论】：

标签： tabulator

【解决方案1】：

您尚未指定您正在使用哪个 Tabulator 版本，但从 5.0 版开始，cellEdited 回调已更改为事件。因此，您现在可以使用：

table.on("cellEdited", function() {
  //do something
})

这是一个工作示例：

var people = [{
    key: 'John Smith',
    value: 'Name is john smith'
  },
  {
    key: 'Andrew Smith',
    value: 'Name is andrew smith'
  }
]

var tableData = [{
  name: "Oli",
  nameIs: "Name is Oli Bob"
}]

var table = new Tabulator("#example-table", {
  height: '100%',
  layout: "fitColumns",
  data: tableData,
  columns: [{
      title: "Name",
      field: "name",
      editor: 'autocomplete',
      editorParams: {
        showListOnEmpty: true,
        freetext: true,
        allowEmpty: true,
        searchFunc: (term, values) => {
          const matches = []

          people.forEach(person => {
            const name = person.key
            const nameIs = person.value

            if (name.toLowerCase().startsWith(term.toLowerCase())) {
              matches.push(name)
            }
          })

          return matches
        },
        values: false
      }
    },
    {
      title: "Name Is",
      field: "nameIs"
    }
  ]
})

table.on("cellEdited", (cell) => {
  const name = cell.getValue()
  const row = cell.getRow()
  const nameIs = people.filter(p => p.key == name)[0].value
  row.update({
    "nameIs": nameIs
  })
})

<link href="https://unpkg.com/tabulator-tables/dist/css/tabulator.min.css" rel="stylesheet">
<script type="text/javascript" src="https://unpkg.com/tabulator-tables/dist/js/tabulator.min.js"></script>

<div id="example-table"></div>

【讨论】：

感谢蒂姆。我正在使用 v5。我确实尝试了 cellEdited，但没有通过我的自动完成获得触发器。我试试这个！