CODEWITHSUNDEEP
tabulator
Waqas
Waqas

Reputation: 639

Multiple Select in Tabulator

Is it possible to have one select field depend on the previous one?

Users select one value from select_1 then accordingly the value in select_2 change. Maybe a custom formatter?

const newCol = {//create column group
                title: oldRow.title,
                field: oldRow.field,
                columns: [
                  {
                    title: rowData.select1.title, field: rowData.select2.name, editor: 'select',
                    editorParams: {values: rowData.select1.values}
                  },
                  {
                    title: rowData.select2.title, field: rowData.select2.name, editor: 'select',
                    editorParams: function (cell) {
                      console.log(cell)
                      return {values: [1, 2, 3]}
                    }
                  },
                ],
              }

From above I need select1 selected value.

Upvotes: 0

Views: 2104

Answers (1)

Adrian Klaver
Adrian Klaver

Reputation: 19620

Would this work Editors?:

"If you want to generate the options when the select editor is triggered, then you can pass a function into the editorParams, that must return the option list in one of the two formats outlined above"

{title:"Name", field:"name", editor:"select", editorParams:function(cell){
    //create a options list of all values from another column in the table
    var rows = table.getRows();
    var values = {};

    rows.forEach(function(row){
        var data = row.getData();

        values[data.fullname] = data.fullname;
    });

    return {values:values};
}

Instead of fetching the all the rows, just fetch the cell value of the previous select column and use that to build the choices for the current select. This sort of depends on the specifics of how the two columns relate to each other. More information on that would be helpful.

Upvotes: 1

Related Questions