title: How to edit only one row at a time in ag grid? Angular7
body: <p>I want to edit only one row at a time and stop the user from editing other rows until the first row is closed or any editable row for that matter is closed.</p>
  <p>Right now I have an edit button which is developed on a custom component. Setting flag to restrict is not working as well.</p>
  <p>the custom button component:</p>
  <pre><code>  template: `
  &lt;button type=&quot;button&quot; *ngIf=&quot;isNew == true&quot; style=&quot;width:50px;&quot; (click) = &quot;onEditClick()&quot; (onchange)=&quot;onChangeTest()&quot; data-action-type=&quot;view&quot; class=&quot;btn btn-iconsize1 btn-link lni-pencil-alt&quot;&gt;
  &lt;/button&gt;
  &lt;button type=&quot;button&quot;  *ngIf=&quot;isNew == false&quot; (click) = &quot;onUpdateClick()&quot; data-action-type=&quot;view&quot; class=&quot;fa fa-check-circle text-success iconsize3&quot;&gt;
  &lt;/button&gt;
  &lt;button type=&quot;button&quot; *ngIf=&quot;isNew == false&quot; (click) = &quot;onCancelClick()&quot; data-action-type=&quot;view&quot; class=&quot;fa fa-times-circle text-danger iconsize3&quot;&gt;
  &lt;/button&gt;`,
  
     onEditClick() {
      console.log(this.params);
      this.params.data['isEdited'] = true;
      // storing old data for comparison
      this.editParams = JSON.parse(JSON.stringify(this.params.data));
      this.isNew = !this.isNew;
      if (this.setFlag === true) {
         alert('close');
      } else {
        this.params.api.startEditingCell({
          rowIndex: this.params.node.rowIndex,
          colKey: 'mtmFlag'
          });
      }
      this.setFlag = true;        
      // else {
      //   alert('already on edit');
      // }
  }
  </code></pre>
  <p>Main component from where the button component is called:</p>
  <pre><code>constructor(private DataService: ResourceService, private UnderscoreService: UnderscoreServices) {
      this.columnDefs = [
          {
              headerName: 'Edit',
              field: 'action',
              sortable: true,
              filter: false,
              cellRenderer: 'buttonRenderer',  // this is the button component
              cellRendererParams: {
                  cancelOtherRowEditors: this.cancelOtherRowEditors.bind(this),
              },
              width: 100,
              pinned: 'left'
          },
  </code></pre>
  <p>}</p>
  <p>Let me know if I can freeze or give a prompt to restrict multiple row edit.</p>