使用 Tabulator 处理相关数据 ID 的最佳方法是什么

Question

使用 Tabulator，如果你有一个 'select' 编辑器并希望它 link 到值 'Male' 和 'Female' 但在 male 和 female 下面是来自另一个物理数据库 table 的值，其 id 值为 1 和 2（与 'row' id 不同），执行此类操作的最佳方法是什么？

'select' 编辑器可以指定下拉列表中项目的显示和 selected 值的文字显示，但没有隐藏（不显示）基础 ID 的位置保存数据时要传递的 selected 值。

我们可以将 select 数据值包装在带有 selects 值 id 的数据属性的 div 中，然后在更新时传递它，但不确定这是最佳选择考虑如何制表符工作。我们也可以只传递原始的 selected 值，然后在服务器上查找它以获取关联的 ID，但这看起来开销很大并且将服务器与客户端紧密耦合，这是行不通的对于像第 3 方 API 这样我们没有服务器控制权的东西。

如有任何关于如何最好地处理此类事情的想法，我们将不胜感激！

Answer 1

select 编辑器允许以多种方式传递值，包括指定项目值及其用户可见标签

如果要对要存储的值显示不同的标签，可以传入一个对象，其中每个属性的key就是要存储的值，如果是selected，每个属性的值将是列表中为其显示的标签。

{title:"Name", field:"name", editor:"select", editorParams:{
    values:{
        "steve":"Steve Boberson",
        "bob":"Bob Jimmerson",
        "jim":"Jim Stevenson",
    }
}}

对于更复杂的选项列表，您可以使用一个对象数组，它允许您定义选项组和禁用的选项。

{title:"Name", field:"name", editor:"select", editorParams:{
    values:[
        { //option group
            label:"Men",
            options:[ //options in option group
                {
                    label:"Steve Boberson",
                    value:"steve",
                },
                {
                    label:"Bob Jimmerson",
                    value:"bob",
                },
            ]
        },
        { //option group
            label:"Women",
            options:[ //options in option group
                {
                    label:"Jenny Jillerson",
                    value:"jenny",
                },
                {
                    label:"Jill Betterson",
                    value:"jill",
                },
            ]
        },
        {//ungrouped option
            label:"Other",
            value:"other",
        },
    ]
}}

有关如何使用此编辑器的完整详细信息，请查看 Editor Documentation

Answer 2

终于明白了。您需要使用查找格式化程序使用与 select 编辑器相同的参数来显示文本值。这并不明显，因为文档中 select 编辑器示例的 none 显示了它的使用。不管怎样，这是一个简单的例子，在两个方向上都显示了它。当然，您可能希望将数据抽象出来而不是字面上的复制，但这里为了帮助展示字面用途，将其复制：

{
    title:"Example", 
    field:"example",
    editor: "select",
    editorParams:{
        "1": "Cute",
        "2": "Fine",
        "3": "Scary",
    },
    formatter:"lookup", // display option, but store value
    formatterParams:{
        "1": "Cute",
        "2": "Fine",
        "3": "Scary",
    }
}

使用 Tabulator 处理相关数据 ID 的最佳方法是什么

Whats the best way to handle related data ids using Tabulator

tabulator