The Accelerated Mobile Pages now support forms in AMP HTML. In a blog post Google said, “We’ve just launched support for forms in AMP HTML. With the “amp-form” extension, the <form> element and its related elements like <input> can be used to build forms within AMP documents. This enables building experiences ranging from a product color picker on an e-commerce detail page to an email field to capture newsletter signups to an interactive poll to engage readers within an article.”
Both Regular Navigation and XHR (XMLHttpRequest, aka Ajax) form submissions are supported. It is however advised to consult the documentation for more details regarding the implementation requirements. Here are the advantages that amp-form offers to improve the experience of filling forms:
- Use the “on” attribute to change the page when the form is submitted, or to change the page depending on whether the form was submitted successfully or with errors.
- Annotate fields upon submission by using templated response rendering. Use this feature to give contextual feedback on what’s wrong with field input.
- Style fields based on validation status using CSS pseudo-classes to provide users with real-time feedback on whether their input is valid.