Most other form components include an option for âSubmit on Enterâ. However, composite forms donât include this option.
On a related note, using Enter to submit on a composite form ignores whether or not the Submit button is active because the form inputs arenât valid.
Hi @ZoryaRose,
It definitely is strange that the option isnât included, but the form still submits when pressing Enter. The same thing with submitting, even though the âDisable submit when invalidâ option is true: it works on the Form components, so it should also work on the Composite Form.
To prevent this, if you havenât already implemented something, you could check {{ ui.form.valid }} in the action run by the On Submit trigger.
To prevent submitting by the Enter key altogether, one idea would be to add a âkeyupâ EventListener to the form element, storing if the Enter key was pressed in a state variable, something like:
const form = document.querySelector('.' + {{ui.myForm.name}});
form.addEventListener('keyup', (e) => {
if (e.key === 'Enter') {
{{state.enterPressed}} = true;
}
});
And then stop the âOn Submitâ action if that state variable is true:
if ({{state.enterPressed}}) {
return {{state.enterPressed}} = false;
}
// submit logic
I also located an issue with the submission of form components. While the form can be submitted, if you hold down the Enter key and then press the submit button, it will start the On Submit trigger action as long as the Enter key isnât released.