Performing a Delete Row action when clicking a button

Performing a Delete Row action when clicking a button

Posted by: cnickerson on 16 August 2024, 1:06 pm EST

• 

  cnickerson

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 16 August 2024, 1:06 pm EST

  Hello,

  In my application, I have a batch-editing enabled FlexGrid. I have a column on it that I intend to use as my “Delete Row” button and I want it to perform the same action as if I were to allow-delete and hit the DEL button on my keyboard.

  Is there a function in JS that would allow me to perform the action on a row as if I had hit DEL?

  I attempted something like below, but found two issues. 1) the click event seemed to be occurring multiple times, leading to all dataItems getting deleted, and 2) the grid did not seem to refresh until I selected a new column

  theGrid.addEventListener(theGrid.hostElement, 'click', function (e) {
      var ht = theGrid.hitTest(e);
      if (ht.panel.columns[ht.col].header== 'Delete' && ht.panel != theGrid.columnHeaders) 
      { 
          var cv = theGrid.collectionView;
          if(cv && cv.items.length > 0)
          {                    
              theGrid.rows.splice(ht.row, 1);
              theGrid.collectionView.items.splice(ht.row, 1);
              theGrid.refresh();
          }
      }            
  });

  Any help pointing me in the right direction is greatly appreciated.

• 

  akshay.rajput

  

  • Post Options:
  • Link
    Copy

  Posted 19 August 2024, 10:23 am EST

  Hi,

  You may use the following code:

          var grid = wijmo.Control.getControl("#flexGrid");
          var dataItem = grid.rows[row].dataItem;
          grid.collectionView.remove(dataItem); 
  

  Please refer to the attached sample.
  
  C1GridDltBtn.zip