Binding an custom event while we enter formula

Binding an custom event while we enter formula

Posted by: sathwik.kotla on 18 September 2022, 6:37 pm EST

• 

  sathwik.kotla

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 18 September 2022, 6:37 pm EST

  I would like to override the “ENTER” event, which happens when we type the formula in the cell.

  In addition to that, I would like to know how I can stop the default formula actions. If the formula is valid spread js by default will populate the cell with the computed formula output, where in our case we would like to send the formula to the backend and populate the cell with the result from the backend.

  Please help me with both the above issues.
  
  Thanks and regards
  
  Sathwik

• 

  ankit.kumar

  

  • Post Options:
  • Link
    Copy

  Posted 19 September 2022, 11:30 pm EST

  Hi Sathwik,

  You can bind the workbook with EditEnding Event that occurs when when a cell is leaving the edit mode. You can check for the valid formula and if the expression type is ‘GC.Spread.CalcEngine.ExpressionType.function’, then you can cancel the action, edit the editor element’s value and set the value coming from the backend.

  For example, you can refer to the following sample that I have created for you: https://jscodemine.grapecity.com/share/UJSAYvncdk6deReArWzuQQ/

  Alternatively, you can use the activateEditor method and handle the ‘Enter’ key press and execute the custom actions you want to perform.

  SpreadJS provides AsyncFunction to support evaluating asynchronous values; it is used for scenarios in which the process could not get the calculated value immediately, such as server side calculation. Please refer to the following demo: https://www.grapecity.com/spreadjs/demos/features/calculation/async-function/purejs

  API References:

  activateEditor method: https://www.grapecity.com/spreadjs/api/classes/GC.Spread.Sheets.CellTypes.Text#activateeditor

  formulaToExpression method: https://www.grapecity.com/spreadjs/api/modules/GC.Spread.Sheets.CalcEngine#formulatoexpression

  evaluateFormula method: https://www.grapecity.com/spreadjs/api/modules/GC.Spread.Sheets.CalcEngine#evaluateformula

  EditEnding Event: https://www.grapecity.com/spreadjs/api/classes/GC.Spread.Sheets.Events#editending

  Regards,
  
  Ankit

• 

  ankit.kumar

  

  • Post Options:
  • Link
    Copy

  Posted 19 September 2022, 11:32 pm EST - Updated 3 October 2022, 12:00 am EST

  

• 

  sathwik.kotla

  • Post Options:
  • Link
    Copy

  Posted 20 September 2022, 8:59 pm EST

  Hi Ankit,
  
  Thanks for the solution Ankit,
  
  But in the sample code which was shared by you whenever we are only able to set data from the backend in the cell, but by this, the default spread js functionality is missing. Whenever we apply the formula in any cell we can see its concerned computed value in the cell but as soon as we enter the edit mode we can see the formula applied to that particular cell.
  
  Can we achieve this scenario?
  
  Thanks and regards
  
  Sathwik

• 

  ankit.kumar

  

  • Post Options:
  • Link
    Copy

  Posted 21 September 2022, 12:03 am EST

  Hi Sathwik,

  I do understand that using the approach suggested by me earlier, it puts the value in the Editor, and not the formula and then the EditEnded is called.

  You can use the Async function provided by the SpreadJS. It is used for scenarios in which the process could not get the calculated value immediately, such as server side calculation.

  Async Function will match your requirement. Async Function Demo:
  
  https://www.grapecity.com/spreadjs/demos/features/calculation/async-function/purejs

  Regards,
  
  Ankit

• 

  sathwik.kotla

  • Post Options:
  • Link
    Copy

  Posted 22 September 2022, 4:01 pm EST

  Hi Ankit,
  
  Can we display the formulas in the formula bar when we are on any particular cell by using events like EnterCell and populate the formula bar with the concerned formula which is not binded to the cell? Do we have any method to pass formulas at the code level by us so that we can get formula displayed correctly even though we populate the data with the above code sample by using editEnding event. Is this achievable?

• 

  ankit.kumar

  

  • Post Options:
  • Link
    Copy

  Posted 25 September 2022, 8:22 pm EST

  Hi Sathwik,

  The formula bar will show the formula if the cell contains formula and will show the row value if the cell doesn’t contain formula. This behavior is by design and currently there is no API to display formula if the cell doesn’t contain formula.

  It is recommended to use the Asyn Function. It has been specifically designed to process the server side calculation. Are you facing some issue while using the Asycn Function?

  Regards,
  
  Ankit

• 

  sathwik.kotla

  • Post Options:
  • Link
    Copy

  Posted 6 October 2022, 6:22 pm EST - Updated 6 October 2022, 6:28 pm EST

  Hi Anit,
  
  As of now, we want to fetch values from the backend and set them as an array to the column, but in order to see the formulas in the cell, we would like to make use of tags that is we set the formula applied in any particular cell as a tag to it. So here we want the user to look at the formula in the side panel which spread js provides as a text field so that he can view and modify from there. Can you help in modifying the side panel of grape city. That should look something like the picture which I am attaching in the side panel. The side panel should be triggered or opened whenever the user double clicks on any cell. Please help us with the sample for this requirement.
  
  FYI : We are using designer component
  
  

• 

  ankit.kumar

  

  • Post Options:
  • Link
    Copy

  Posted 10 October 2022, 12:21 am EST

  Hi Sathwik,

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

  In the sample, when you double click a cell, it will open the Side Panel, and will view the formula. When you exit the textbox, it will set the text inside the textbox as tag of the active cell.

  API References:
  
  registerTemplate: https://www.grapecity.com/spreadjs/api/designer/modules/GC.Spread.Sheets.Designer#registertemplate

  setConfig: https://www.grapecity.com/spreadjs/api/designer/classes/GC.Spread.Sheets.Designer.Designer#setconfig

  Regards,
  
  Ankit

• 

  ankit.kumar

  

  • Post Options:
  • Link
    Copy

  Posted 10 October 2022, 12:24 am EST - Updated 10 October 2022, 12:29 am EST