Forums Home / Spread / SpreadJS
Posted by: sathwik.kotla on 18 August 2022, 10:59 pm EST
sathwik.kotla
Posted 18 August 2022, 10:59 pm EST
In the designer tool if I try presing =[ in any of the cell we have a drop-down which is suggesting some functions that excel supports but In our case, we would like to have our custom values as suggestions for our users, So do we have any way to override the trigger.
Also please guide me on how to create custom triggers in spread js and also how to integrate the action to be performed after the event to a react component.
sathwik.kotla
Posted 18 August 2022, 11:00 pm EST - Updated 3 October 2022, 12:01 am EST
ankit.kumar
Posted 22 August 2022, 12:12 am EST - Updated 3 October 2022, 12:01 am EST
Hi,
As per my understanding, you want to define your own custom function and want the suggestion to be available when typing into a cell. If this is the use case, you can refer to the following sample that describes how to define the custom function: https://www.grapecity.com/spreadjs/demos/features/calculation/custom-functions/purejs
You can also define a global custom function using the defineGlobalCustomFunction method.
Please refer to the following sample that I have created for you: https://jscodemine.grapecity.com/share/tPYldkwjZU2LCter_pA_Lw/
API References:
defineGlobalCustomFunction method: https://www.grapecity.com/spreadjs/docs/latest/online/SpreadJS~GC.Spread.CalcEngine.Functions~defineGlobalCustomFunction.html
Function Type: https://www.grapecity.com/spreadjs/docs/latest/online/SpreadJS~GC.Spread.CalcEngine.Functions.Function.html
addCustomFunction method: https://www.grapecity.com/spreadjs/docs/latest/online/SpreadJS~GC.Spread.Sheets.Workbook~addCustomFunction.html
Please let us know if you have a different use case.
Regards
Ankit
sathwik.kotla
Posted 22 August 2022, 12:22 am EST - Updated 3 October 2022, 12:01 am EST
Hi, Ankit thanks for the reply,
Our use case exactly is,
Whenever the user types in “=[” in any particular cell that means he wants to write a formula that is based on the columns which are existing in the table, so we want a drop-down that opens whenever the user types in [ keyword which has all the column header names as the suggestion in it, You can refer the use case in the below image.
Regards,
Sathwik
ankit.kumar
Posted 23 August 2022, 7:35 pm EST
Hi Sathwik,
Based on your requirement, you could create your own Custom Cell Type to show the column names. You could handle when the user click “=[” and show the column names.
Custom Cell Type Demo: https://www.grapecity.com/spreadjs/demos/features/cells/cell-types/custom/purejs
Custom Cell: https://www.grapecity.com/spreadjs/docs/latest/online/cellcustom.html
Regards
Ankit
sathwik.kotla
Posted 25 August 2022, 4:36 pm EST
Hi Ankit,
Can you share a working demo with the same use case, I am trying to achieve the functionality but cannot do so, can you please share a sample working demo project where I get a drop-down of column names when =[ is clicked?
Thank you in advance
Regards
Sathwik
sathwik.kotla
Posted 28 August 2022, 11:31 pm EST
Hi Ankit,
can you help with this issue as soon as possible?
Regards,
Sathwik
ankit.kumar
Posted 29 August 2022, 12:17 am EST
Hi Sathwik,
You can use the activateEditor method and add event listener for editor element. Check for the text “=[” and add a custom list item showing the column names of the table.
Please refer to the following sample that I have created for you: https://jscodemine.grapecity.com/share/o3I-FFhLyEaprgsTZgUQNA/
You can modify the styling of the list item, and add other styles on hover, etc.
API References:
activateEditor method: https://www.grapecity.com/spreadjs/api/classes/GC.Spread.Sheets.CellTypes.Text#activateeditor
deactivateEditor method: https://www.grapecity.com/spreadjs/api/classes/GC.Spread.Sheets.CellTypes.Text#deactivateeditor
find method: https://www.grapecity.com/spreadjs/api/classes/GC.Spread.Sheets.Tables.TableManager#find
Regards
Ankit
ankit.kumar
Posted 29 August 2022, 12:18 am EST - Updated 3 October 2022, 12:01 am EST
sathwik.kotla
Posted 8 September 2022, 4:29 pm EST - Updated 3 October 2022, 12:01 am EST
Thanks for providing the solution but if you can observe if we press anywhere in the dropdown apart from the fields all the column names are being selected, please provide help me resolve the issue. Please refer to the attached GIF
ankit.kumar
Posted 12 September 2022, 2:28 am EST
Hi Sathwik,
You can refer to the following modified sample: https://jscodemine.grapecity.com/share/IAvjyQOsjk6LRD3p0twZUw/
In the modified sample, I have checked the condition to add the column name only if the target element is paragraph or list item.
Regards,
Ankit
sathwik.kotla
Posted 18 September 2022, 10:55 pm EST
Hi Ankit,
when I am trying to call the code as a function on different sheets in the workbook we are getting multiple dropdowns one on top of them. Please look into the code sample attached where I have called the method twice.Can we bind or unbind the component form spread or something, Please look into the issue and provide me with any solution.
You can refer to the following modified sample:
https://jscodemine.grapecity.com/sample/hli-PN25zkSSNPrQa14s5g/
Thanks and Regards
Sathwik
ankit.kumar
Posted 19 September 2022, 10:24 pm EST - Updated 3 October 2022, 12:01 am EST
Hi Sathwik,
I didn’t understand your use case. Could you please explain the issue you are facing with the existing solution?
The earlier provided solution works for all the sheets. There is no need to execute it for all the sheets separately.
You can refer to the following gif that shows the steps I have followed to test the table on different sheet. Could you please let me know if I am missing any possible use case where it is not working. Please share a gif/video describing the issue.
Regards,
Ankit
sathwik.kotla
Posted 12 October 2022, 7:47 pm EST - Updated 13 October 2022, 4:52 pm EST
Hi Ankit,
In the same codesample if you try and create more than two sheets and paste the table data as you are doing in the above gif we are not getting the dropdown.
One more additional thing is whether can we update the dropdown data according to the text which is entered after “[” something like filtering.
For example if we have typed [a the drop down should have column names starting with a.
Can you help me with the issue?
https://jscodemine.grapecity.com/share/IAvjyQOsjk6LRD3p0twZUw/
ankit.kumar
Posted 13 October 2022, 10:16 pm EST - Updated 13 October 2022, 10:21 pm EST
Hi Sathwik,
I tried running tests with more than 2 sheets, but I was still unable to reproduce the problem on my end. Please refer to the gif below, which illustrates the actions I took. If there is anything I’m missing, do let me know.
Please include a gif or video that reproduces the problem as well.
I’m making a sample that will filter the column names when a key is pressed. When I’m done, I’ll give you a sample of that.
Regards,
Ankit
ankit.kumar
Posted 17 October 2022, 7:25 am EST
Hi,
Please have a look at the sample below, where the column names have been filtered depending on the names entered in the Cell.
Sample: https://jscodemine.grapecity.com/share/HYl6ZvO_8EyRW38UGaT0LA/
Regards,
Ankit
