title: Material-table editable: Making all rows editable at once
body: <p>I have a table with multiple rows and I want to be able to make them all editable at once. Using the editable tag I've been able to go into edit mode and make one row at a time editable, but if I tab from one row to the next it doesn't save changes. I need to stop and click on a button to save changes. I want to be able to make changes throughout the table before hitting a save button. Is there a way to do this with material-table?</p>
  
  <pre><code>class Editable extends React.Component {
    constructor(props) {
      super(props);
      this.state = {
        columns: [
          { title: 'Name', field: 'name' },
          { title: 'Surname', field: 'surname', initialEditValue: 'initial edit value' },
          { title: 'Birth Year', field: 'birthYear', type: 'numeric' },
          {
            title: 'Birth Place',
            field: 'birthCity',
            lookup: { 34: 'İstanbul', 63: 'Şanlıurfa' },
          },
        ],
        data: [
          { name: 'Mehmet', surname: 'Baran', birthYear: 1987, birthCity: 63 },
          { name: 'Zerya Betül', surname: 'Baran', birthYear: 2017, birthCity: 34 },
        ]
      }
    }
  
    render() {
      return (
        &lt;MaterialTable
          title="Editable Preview"
          columns={this.state.columns}
          data={this.state.data}
          editable={{
            onRowUpdate: (newData, oldData) =&gt;
              new Promise((resolve, reject) =&gt; {
                setTimeout(() =&gt; {
                  {
                    const data = this.state.data;
                    const index = data.indexOf(oldData);
                    data[index] = newData;
                    this.setState({ data }, () =&gt; resolve());
                  }
                  resolve()
                }, 1000)
              }),
          }}
        /&gt;
      )
    }
  }
  </code></pre>