title: Using 'save' and 'cancel' button in cell editing for Ag-grid
body: <p>I am using Ag-grid in my Angular application and the data in the grid is populated from a web service. I implemented cell editing in this grid, so when I click one of the columns then the entire row will be editable and when i click outside the grid stops editing. The following is the code in html and the component file:</p>
  
  <pre><code>&lt;ag-grid-angular #agGrid style="width: 100%; height: 600px;" class="ag-theme-balham left" [rowData]="rowData" [columnDefs]="columnDefs"
                              [gridOptions]="gridOptions" rowSelection="multiple" pagination=true (rowSelected)="onRowSelected($event)"&gt;
                          &lt;/ag-grid-angular&gt;
  </code></pre>
  
  <p>component.ts file:</p>
  
  <pre><code>this.gridOptions = {
                  defaultColDef: {
                      editable: (event: any) =&gt; {
                          if (this.isGridDataEditable) {
                              return true;
                          } else {
                              return false; // true/false based on params (or some other criteria) value
                          }
                      },
                      filter: true
                  },
                  singleClickEdit: true,
                  stopEditingWhenGridLosesFocus: true,
                  paginationPageSize: 20,
                  editType: 'fullRow',
                  onCellValueChanged: (event: any) =&gt; {
                  },
                  onRowValueChanged: (event: any) =&gt; {
                  },
                  onRowEditingStopped: (event: any) =&gt; {
                  }
              };
          }
  </code></pre>
  
  <p>The column definitions are generated dynamically based on the response from the web api. When the editing stops if the data changes then I have to make a call to the web api to update the data, all this is working as expected.But I would like to add a save and cancel button just above the grid and when the user clicks on save only then make the call to the web api, clicking on cancel button should revert the grid data back to the old values. I came across the api stopEditing(true) but it did not work. Could you please let me know how I could achieve this functionality.</p>