根据另一个选择的数据编辑触发器更新行上的选择编辑参数

Question

希望根据另一个单元格的选定值更新行定义的选择值初始化的 editParams 值到备用集。在示例代码中，您将看到用户是否选择了我正在尝试更新可用权限以在所选模块上配置的模块。非常感谢任何帮助。

我查看了控制台日志中的对象，但没有看到任何方法。

`function rolesTable(rolesTableName) {
var rolesTable;

setTimeout(function() {

    rolesTable = new Tabulator(rolesTableName, {
        data:orgRolesData,
        height:"311px",
        layout:"fitColumns",
        placeholder:"No Data Set",
        addRowPos:"top",
        cellEdited:function(cell){
            var data = cell.getData();
            var row = cell.getRow();

            if (data['module'] == "Organization") {
                /*
                How to set the actions select values for the row
                ?? row.C
                */
            }

            var column = cell.getColumn();
            console.log(row);

        },


        columns:[
            {title:"Name", field:"name", sorter:"string", width:200, editor:"input"},
            {title:"Module", field:"module", sorter:"string", editor:"select", editorParams:{values:{"Organization":"Organization", "User":"User", "Event":"Event", "Asset":"Asset"}} },
            {title:"Action", field:"action", sorter:"string", editor:"select", editorParams:{values:{"A":"A", "B":"B", "C":"C"}} },
            {title:"Create", field:"create", align:"center", formatter:"tickCross", sorter:"boolean", editor:true},
            {title:"Read", field:"read", align:"center", formatter:"tickCross", sorter:"boolean", editor:true},
            {title:"Update", field:"update", align:"center", formatter:"tickCross", sorter:"boolean", editor:false},
            {title:"Delete", field:"delete", align:"center", formatter:"tickCross", sorter:"boolean", editor:false},
        ],
        initialSort:[
            {column:"name", dir:"asc"}, //sort by this first
            {column:"module", dir:"desc"}, //then sort by this second
            ]

        });


    rolesTable.redraw();
}, 800);

}`

Answer 1

const tabledata = [{
  dep: "A",
  name: "Oli Bob",
  score: 100
}];

const orignalColumns = [{
    title: "Name",
    field: "name",
    sorter: "string",
    width: 200,
    editor: "input"
  },
  {
    title: "Module",
    field: "module",
    sorter: "string",
    editor: "select",
    editorParams: {
      values: {
        "Organization": "Organization",
        "User": "User",
        "Event": "Event",
        "Asset": "Asset"
      }
    }
  },
  {
    title: "Action",
    field: "action",
    sorter: "string",
    editor: "select",
    editorParams: {
      values: {
        "A": "A",
        "B": "B",
        "C": "C"
      }
    }
  },
  {
    title: "Create",
    field: "create",
    align: "center",
    formatter: "tickCross",
    sorter: "boolean",
    editor: true
  },
  {
    title: "Read",
    field: "read",
    align: "center",
    formatter: "tickCross",
    sorter: "boolean",
    editor: true
  },
  {
    title: "Update",
    field: "update",
    align: "center",
    formatter: "tickCross",
    sorter: "boolean",
    editor: false
  },
  {
    title: "Delete",
    field: "delete",
    align: "center",
    formatter: "tickCross",
    sorter: "boolean",
    editor: false
  },
];

const modifieldColumns = [{
    title: "Name",
    field: "name",
    sorter: "string",
    width: 200,
    editor: "input"
  },
  {
    title: "Module",
    field: "module",
    sorter: "string",
    editor: "select",
    editorParams: {
      values: {
        "Organization": "Organization"
      }
    }
  },
  {
    title: "Action",
    field: "action",
    sorter: "string",
    editor: "select",
    editorParams: {
      values: {
        "A": "A",
        "B": "B",
        "C": "C"
      }
    }
  },
  {
    title: "Create",
    field: "create",
    align: "center",
    formatter: "tickCross",
    sorter: "boolean",
    editor: true
  },
  {
    title: "Read",
    field: "read",
    align: "center",
    formatter: "tickCross",
    sorter: "boolean",
    editor: true
  },
  {
    title: "Update",
    field: "update",
    align: "center",
    formatter: "tickCross",
    sorter: "boolean",
    editor: false
  },
  {
    title: "Delete",
    field: "delete",
    align: "center",
    formatter: "tickCross",
    sorter: "boolean",
    editor: false
  },
];

const table = new Tabulator("#example-table", {
  data: tabledata,
  cellEdited: function(cell) {
    const data = cell.getData();

    if (data['module'] === "Organization") {
      table.setColumns(modifieldColumns);
    }


  },
  columns: orignalColumns
});

<head>

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

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