I have created a custom Gutenberg block that creates a form. This form contains a button and I want to attach a script to this button to do form validation and then make an AJAX call to back end to submit the form.
I have all this working correctly in the "edit" function. And things work as expected in Gutenberg edit mode.
What question is about the save function. First of all I am not able to use Button component in save mode. If I use button element and attach function to onclick as onclick ={OnHandleSubmit}, the curly brackets do not resolve and I get the text as is in the final html.
If I write my own function in save render html the curly brackets in the script cause a problem.
I tried writing my function in separate js file and en-queuing that, but I get function not defined error.
Finally, I had to resort to using & # 123; etc in place of special characters in the script in the "save" function. I feel that there must be a better way to handle the script in save mode.
Please help with this.
Thanks.