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

Question

我对tabulator.js有点陌生，但到目前为止，它很棒，但我有一个问题。我有一个JSON文件，其中包含一些客户端。数据如下：

{
"clients": [
{
"city": "Brussels",
"email": "[e-mail]",
"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", {
data: response.users,
index: "idUser",
layout: "fitColumns",
responsiveLayout: "hide",
tooltips: true,
addRowPos: "top",
pagination: "local",
paginationSize: 7,
movableColumns: 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},
}
]

希望这能有所帮助。