Cell goes in editable mode on single click

Cell goes in editable mode on single click

Posted by: nilesh_nichal on 1 June 2022, 3:32 pm EST

• 

  nilesh_nichal

  • Post Options:
  • Link
    Copy

  Posted 1 June 2022, 3:32 pm EST

  In wj-flex-grid, I want the cell to go in editable mode only when I double click on a cell.
  In current scenario, the cell goes in editable mode in two cases -
  1. When we double click on cell.
  2. Whenever we do single click on a cell and after few seconds if I again do single click on that same cell, it goes in editable mode.
  
  We want only the 1st use case to be executed and not the second one.
  Please suggest if there is any solution to stop the cell to go in editable mode for 2nd use case.
• 

  sonu.pandey

  

  • Post Options:
  • Link
    Copy

  Replied 6 June 2022, 12:31 am EST

  Hello,
  
  We apologize for the delayed response, to achieve the desired functionality you may handle the selectionChanged event of the FlexGrid and add a custom class to the cell element after delay as per your requirement then you can handle the beginningEdit event to prevent the editing of that cell by checking the added class. Please refer to the sample link below demonstrating the same:
  
  https://stackblitz.com/edit/js-rwgov9?file=index.js
  
  Regards
• 

  nilesh_nichal

  • Post Options:
  • Link
    Copy

  Replied 7 June 2022, 10:56 pm EST

  Hi,
  The given solution works well. Thanks.
  
  However, it does not work correctly for the below test case:
  
  Step-1 : Click (single click) on the last row cell, e.g, "Greece"
  Step-2 : Click outside the grid
  Step-3 : Click(single click) again back on the previous cell
  Step-4 : Click outside the grid
  Step-5 : Now double click back the previous cell.
  
  Expected : It should get editable now
  Actual: It is not clickable now.
• 

  sonu.pandey

  

  • Post Options:
  • Link
    Copy

  Replied 8 June 2022, 10:46 pm EST

  Hello,
  
  The observed issue occurred because on moving focus outside the grid the cell with the 'test' class doesn't get re-render thus it remains to be inactive. To resolve the issue you may handle the lostFocus event of the FlexGrid and remove the classes from the previous cells containing the class. Please refer to the sample link below demonstrating the same:
  
  https://stackblitz.com/edit/js-rnwdgj?file=index.js
  
  
  Regards