Form 1 will take 2 inputs, with the below validations:
emailId- Required. Must be a valid email IDpassword- Required. Must contain minimum 2 capital letters, 2 small letter, 2 numbers and 2 special characters.
Form 2 will take 3 inputs, with the below validations:
firstName- Required. Allow only alphabets. Minimum of 2 character and maximum 50.lastName- Optional. If not empty, will only allow alphabetsaddress- Required. Minimum length 10.
Form 3 will take 3 inputs, with the below validations:
countryCode- Required. Allow only 2 country code, India (+91) and America (+1). Must be a dropdown inputphoneNumber- Required. Allow only 10 digit numeric phone numberacceptTermsAndCondition- Required. Will be a checkbox input and must be selected.
Each form will have 3 button, named below:
Back: Will be disabled for Form 1Save: Will be enabled for all forms`Save and Next: Will be disabled for Form 3
- User can
Save and Nextonly if the form valid for each step. - User can go back to previous screen to change it's values
- Show error message to user for failed input validation
At the end of Form 3, when the user will click on save all the details needs to submitted, Show the details in an modal.
Note:
acceptTermsAndConditionmust not be submitted
Sample Data:
{
"emailId": "john.doe@gmail.com",
"password": "QWerty##11",
"firstName": "John",
"lastName": "Doe",
"address": "22/B, Baker Street, London - 10089",
"countryCode": "+91",
"phoneNumber": "2225550909"
}