FormulaTextBox - Focus issue when binding to an input component

FormulaTextBox - Focus issue when binding to an input component

Posted by: dana.eliyahu on 20 July 2023, 9:51 am EST

• 

  dana.eliyahu

  • Post Options:
  • Link
    Copy

  Posted 20 July 2023, 9:51 am EST - Updated 20 July 2023, 9:54 am EST

  Hi, We represent the formula bar by binding the FormulaTextBox to an tag.

  However, when typing a function name and then clicking on one of the options on the function dropdown (to complete the function name), it completes the name and the first “(”, but then it is not possible to select a range of cells without re-clicking on the formula bar.

  It seems that it is related to a focus issue when clicking outside of the input itself.

  We noticed that in the spread designer it works because the FormulaTextBox has binding to a div that has EditableContent=“true” and not an input.

  We tried to return the focus to the input manually but it still doesn’t seem to work.

  Is it possible to find a solution for using an input in that case?

  (attached a video demonstrating the issue - the first time the focus is lost and then after re-clicking the selection works).

  formula text box focus issue.zip

  Thanks.

• 

  ankit.kumar

  

  • Post Options:
  • Link
    Copy

  Posted 21 July 2023, 8:36 am EST

  Hi Dana,

  We are sorry but for the FormulaTextBox to work properly, it is required that the hostElement should be of type “div” and it has “contentEditable” set to the true. Therefore, in case of “input” type, it may not produce the desired result.

  We request you to kindly use the “div” element type and set it’s contentEditable property to “true” as defined in the Demo: https://www.grapecity.com/spreadjs/demos/features/calculation/formula-textbox/basic-formula-textbox/purejs

  I am not sure why you are not using the “div” element type? Are you facing some issues? Could you kindly explain the same?

  Regards,

  Ankit