可以为每个单元格设置 Tabulator 自动完成功能吗?不是专栏?

Can Tabulator autocomplete be set up per cell? Not column?

我的 Tabulator 定义中需要有两个自动完成。用户将 select 一名员工 - 首先是自动完成 - 然后当他移动到 select 一份合同 - 第二列时,自动完成必须链接到第一列中 selected 的值。

据我所知Tabulator does not have such feature. So I was thinking that upon clicking the "contract" cell that column definition - autocomplete definition - would be updated. I cannot make it work because the function updateDefinition is buggy。它创建新列而不是更新其定义。

工作jsFiddle

  table.on("cellEditing", function(cell){
        //e - the click event object
        //cell - cell component
       updateTitle(cell)
})
table.on("cellClick", function(e, cell){
  updateTitle(cell)
})

function updateTitle(cell){
  var field = cell.getField()
  if (field == "contract" || field =="id"){
    var column = cell.getColumn()
    var name = cell.getRow().getData().name
    console.log(field)   
    console.log(name)
    column.updateDefinition({title:"Updated Title"}) 
  }
}

我正在使用 MaterializeCSS 及其 autocomplete 但我不知道如何使用它 inside 制表符。如果这真的是个好主意。

能否请您提出最佳解决方案?

在您的示例中,您仍然希望每列都有不同的自动完成,您只是想让“contract”的值自动完成取决于“name”列的值。

您可以将函数而不是对象传递给 editorParams 选项,每次打开编辑器时都会触发该函数,并且应该 return 编辑器的参数对象。

使用这个你可以创建一个函数,该函数将根据名称单元格的值更改编辑器参数的 values 属性。在这个例子中,我们假设这些值存储在一个简单的合同查找列表中,用于每个用户的名称,但您可以随意查找

{title:"contract", field:"contract", editor:"autocomplete", editorParams: function(cell){
     var contracts = {
        bob:["A", "B", "C"],
        jim:["D", "E", "F"],
     };

    return {
        values: contracts[cell.getData().name] //set values list based on name cell value
    }
}},