Worksheet use state as a dataSource

Worksheet use state as a dataSource

Posted by: don.reinard.gomez on 23 March 2022, 6:43 pm EST

• 

  don.reinard.gomez

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 23 March 2022, 6:43 pm EST

  HI,

  I would like to know if its possible to use a state variable as a dataSource and how to trigger the state update for any data modifications

  
  const [workSheetDataSource, setWorkSheetDataSource] = useState(null);
  return (
      <Worksheet dataSource={workSheetDataSource}/>
  )
  
  

• 

  ankit.kumar

  

  • Post Options:
  • Link
    Copy

  Posted 24 March 2022, 4:59 am EST

  Hi,

  You can definitely use the useState hook to do the worksheet dataSource modifications.

  Please refer to the following sample that we have created for you: https://jscodemine.grapecity.com/share/q1CTJZx8xk26CcQ_DNZOKw/

  Please let us know if you face any further issues.

  Regards
  
  Ankit

• 

  don.reinard.gomez

  • Post Options:
  • Link
    Copy

  Posted 26 March 2022, 6:17 pm EST

  Thank you so much for your reply!
  
  I woould also want to ask as to how to update the state variable whenever I mutate the data in the worksheet.

• 

  ankit.kumar

  

  • Post Options:
  • Link
    Copy

  Posted 28 March 2022, 12:52 am EST

  Hi,

  You can use the ValueChanged Event that occurs when the value in the subeditor changes. At a given point time, you can get all the dirty cells using getDirtyCells method. Once you get the information of cell(s), update the state variable accordingly.

  ValueChanged Event: https://www.grapecity.com/spreadjs/docs/latest/online/SpreadJS~GC.Spread.Sheets.Events~ValueChanged_EV.html

  GetDirtyCells method: https://www.grapecity.com/spreadjs/docs/latest/online/SpreadJS~GC.Spread.Sheets.Worksheet~getDirtyCells.html

  Dirty Items Demo: https://www.grapecity.com/spreadjs/demos/features/cells/edit/dirty-items#demo_source_name

  Please let us know if you face any further issues.

  Regards
  
  Ankit