将JSON数据添加到表中每个单元格（Tabulator.js）的下拉菜单中

Question

我是tabulator.js的新手，但到目前为止，它很棒，但是我有一个问题。我有一个包含一些客户端的JSON文件。这是数据：

{
  "clients": [
    {
      "city": "Brussels",
      "email": "[email protected]",
      "firstName": "Benoit",
      "idClient": 1,
      "lastName": "Dupont",
      "mailBox": "6",
      "phoneNumber": "0465237956",
      "postCode": "1200",
      "street": "Clos Chapelle-aux-Champs",
      "streetNumber": "43"
    }
  ]
}

目前，只有一个客户端，但是将来会将它们更多地添加到此json数据中。因此，我想在“客户端”列的每一行中添加一个下拉菜单，如下面的屏幕截图所示。https://ibb.co/8zH8S26

（链接到我的屏幕截图）

我曾尝试遵循Tabulator.js的文档，但似乎无法在我的代码中使用JSON数据很好地实现它`var table = new Tabulator（“＃test”，{数据：response.users，索引：“ idUser”，布局：“ fitColumns”，sensitiveLayout：“隐藏”，工具提示：是的，addRowPos：“ top”，分页：“本地”，分页大小：7movingColumns：true，resizableRows：true，

    columns: [
        {title: "Registration Date", field: "registrationDate", formatter: dateFormatter},
        {title: "Worker", field: "worker", formatter: "tickCross", editor: true},
        {title: "First Name", field: "firstName"},
        {title: "Last Name", field: "lastName"},
        {title: "Username", field: "username"},
        {title: "Email", field: "email"},
        {title: "City", field: "city"},
        {
            title: "Client", editor: "select", editorParams: {
                values: {
                    // TODO INSERT THE VALUES OF THE JSON DATA HERE
                }
            }
        },
        {
            title: "", formatter: buttonTest, cellClick: function (e, cell) {
                const data = {
                    user: cell.getRow().getData().idUser,
                    worker: cell.getRow().getData().worker
                };

                updateData("users/" + data.user.idUser, data, token, function (response) {
                    console.log(response);
                }, function (response) {
                    console.log(response.error);
                })
            }

        }
    ],

});

`https://ibb.co/TqqMqK1

（链接到代码的图片）

一旦从下拉列表中选择了选项，我想记住所选客户端的ID。

我几乎尝试了所有事情，但没有任何效果。你能帮我么？请不要犹豫，说明您的解决方案（我是视觉学习者）。

非常感谢您

Answer 1

我使用以下代码做了类似的事情：-

let clientSel={}
window.JQuery.ready(function(){
    // first create a json client list  
    let jsonStr = "[{'rid':'A01','desc':'client 1'}, {'ri'B01','desc':'client 2'}]"  
    let retJSON = JSON.parse(jsonStr)
    // create the cleinSel object from the json
    $(retJSON).each(index => {
        var key = retJSON[index].rid;
        var val = retJSON[index].desc 
        clientSel[key]=val;
    });
});


columns = [
    {title:"Client", field:"client",editor:"select", editorParams:function(cell){
        //create a options list of all values from another column in the table
        var rows = clientSel;
        return {values:rows};}, formatter:"lookup", formatterParams:function(){
            return clientSel},
    }
]

希望这会有所帮助。