AMP: Building Accelerated Mobile Pages

Custom form validation

AMP has built-in validation strategies that you can tap into by adding the custom-validation-reporting attribute to the form element, with one of these values:

• show-first-on-submit: Displays only the first validation error when a form is submitted
• show-all-on-submit: Displays validation errors for all invalid inputs after the form is submitted
• as-you-go: Shows validation errors for an invalid input field after the user has interacted with that field, but before the form has been submitted

Let's add this to our form element (/ch6/signup-validation.html):

<form method="post" action-xhr="/ch6/signup-xhr.php" target="_top"      custom-validation-reporting="as-you-go">      ...</form>

We can also define custom validation messages ...