Насколько я понимаю, лучше всего использовать атрибут verify-xhr
-> проверить поля на сервере -> сервер отвечает на любые ошибки в формате JSON.https://www.ampproject.org/docs/reference/components/amp-form#verification
<form
method="post"
action-xhr="/form/verify-json/post"
verify-xhr="/form/verify-json/post"
target="_blank">
<fieldset>
<label>
<span>Email</span>
<input type="text" name="email" required>
</label>
<label>
<span>Zip Code</span>
<input type="tel" name="zip" required pattern="[0-9]{5}(-[0-9]{4})?">
</label>
<input type="submit" value="Submit">
</fieldset>
<div submit-success>
<template type="amp-mustache">
<p>Congratulations! You are registered with {{email}}</p>
</template>
</div>
<div submit-error>
<template type="amp-mustache">
{{#verifyErrors}}
<p>{{message}}</p>
{{/verifyErrors}}
{{^verifyErrors}}
<p>Something went wrong. Try again later?</p>
{{/verifyErrors}}
</template>
</div>
</form>
Ответ от сервера может быть таким:
{
"verifyErrors": [
{"name": "email", "message": "That email is already taken."},
{"name": "zip", "message": "The city and zip do not match."}
]
}