Situation: I am building a input form to collect information.
Problem: The form is supposed to be submitted only after clicking the button, however, after i enter date value in my date input field(copy paste 2022-07-21 and press enter), the form was submitted automatically. I didn't write any submit event handler for my form, so it will raise a notification like "no submit event handler for form".
Solution: I have come up with a solution like i set some other field as required so that the form cannot be submitted when those fields are empty, but that does not really solve the problem.
Hey @pengcheng_xu!
Thanks for surfacing this. At the moment the Enter key will always trigger form submission, though the option to disable that has been requested before and I can let you know if it's included. In the meantime, instead of adding a separate input, you might also try passing a dynamic value to the "Disable submit" field:
Is there a particular instance when you'd like people to be able to use enter to submit the form or would you like it to always be on button click?
Hi @Kabirdas !
In the application, user should always just submit the form by clicking the button, so, I would like submit event only on button click.
Can you elaborate a bit more on the dynamic value solution?
Thanks for your time and help.
One thing you might try is switching your form to a regular container:
You can then add your own button with a "Click" handler that triggers the form submission. You won't be able to reference {{ form.data }} but doing so should remove submission with enter. It's not perfect but do you think that might work for your use case?
The dynamic value solution can be used, for instance, if you only want users to be able to submit the form once a certain condition is met. It's similar to having another field that's required but removes the need for the extra component:
