Expand my Community achievements bar.

Join expert-led, customer-led sessions on Adobe Experience Manager Assets on August 20th at our Skill Exchange.
SOLVED

How can we stop submission of form when error alert is pop up while submitting form

Avatar

Level 3

Hi,

I have created one signup form and added validations.When those validations fails the error comes in alert form but as soon as i click on okay of pop up error the form gets submitted.  I have added custom functions under edit rules can any one please tell how can i stop the submission of form while error pop up. The code and  images below:

js code :

function finalValidate(first_name,email,password,confirmPassword){

// Simple validation checks
if (first_name === '') {
alert('Name is required.');
return;
}

if (email === '') {
alert('Email is required.');
return;
}

if (email != null) {
var x= email;
var atposition=x.indexOf("@");
var dotposition=x.lastIndexOf(".");
if (atposition<1 || dotposition<atposition+2 || dotposition+2>=x.length){
alert("Please enter a valid e-mail address \n atpostion:"+atposition+"\n dotposition:"+dotposition);
return;
}

if (password === '') {
alert('Password is required.');
return;
}

if (password !== confirmPassword) {
alert('Passwords do not match.');
return;
}
alert('Form submitted successfully.');

}
}

 

Edit rules

 

Screenshot from 2023-09-08 17-08-54.png

 

As soon as i click on OK the form gets submitted :

 

Screenshot from 2023-09-08 17-13-41.png

1 Accepted Solution

Avatar

Correct answer by
Employee

The validation expression [1] needs to return false if the required condition is not met, and true otherwise. Based on the condition - the field is marked as valid/invalid. When the Form is submitted - it automatically would focus on the required field, and a validation error message would be shown for the field.

In case of multiple errors in the form - the error is marked for all the relevant fields, but the focus is set to the first field with the error.

 

[1] https://experienceleague.adobe.com/docs/experience-manager-65/forms/adaptive-forms-advanced-authorin...

View solution in original post

3 Replies

Avatar

Level 3

Can anyone answer?

Avatar

Correct answer by
Employee

The validation expression [1] needs to return false if the required condition is not met, and true otherwise. Based on the condition - the field is marked as valid/invalid. When the Form is submitted - it automatically would focus on the required field, and a validation error message would be shown for the field.

In case of multiple errors in the form - the error is marked for all the relevant fields, but the focus is set to the first field with the error.

 

[1] https://experienceleague.adobe.com/docs/experience-manager-65/forms/adaptive-forms-advanced-authorin...

Avatar

Community Advisor

Instead of return while validation failed, set the focus on the failed field on the form.