Search code examples
javascriptreactjsmaterial-uimaterial-table

How can I change the index column using Material-table


Im using Material-table and I need to alter column index to put at the end of table because by default this column (actions) it is in the beginning.

Below the table code:

 <MaterialTable
    title=""
    icons={tableIcons}
    localization={{
      body: {
        editRow: {
          saveTooltip: "Salvar",
          cancelTooltip: "Cancelar",
          deleteText: "Tem certeza que deseja deletar este registro?"
        },
        addTooltip: "Adicionar",
        deleteTooltip: "Deletar",
        editTooltip: "Editar"
      },
      header: {
        actions: "Ações"
      }
    }}
    columns={state.columns}
    data={state.data}
    editable={{
      onRowAdd: newData => createInstructor(newData),
      onRowUpdate: async (newData, oldData) =>
        updateInstructor(newData, oldData),
      onRowDelete: oldData => deleteInstructor(oldData)
    }}
  />

Solution

  • There's a dedicated option actionsColumnIndex:

    actionsColumnIndex number 0 - Order of actions column

    In order to make your actions column the last, assign a value of -1 to it.