The form Attribute

The Current State of HTML5 Forms

<input type="text" form="form_id">
<form id="form_id">
   <input type="submit">

Live Demo

Outside the form

In the form:




iOS 5+





The Low Down

The form attribute can be used to explicitly associate a form element with a form, even if that form is not its ancestor, and can disassociate a form element from the form in which it is nested.

    • The form attribute enables placing an <input>, <button>, or other form field anywhere within a document, not just as descendants of a <form> elements. It also enables a non-disabled form field from being submitted along with its form ancestor.
    • If a form control is nested within a <form>, by default it will be associated with that form. You can disassociate it from that form with form="", or associate it with another form within the document with form="id_of_other_form".
    • The form attribute takes as its value the ID of the form it should be bound to. To associate a form control with a <form> of which it is not a descendant, set the form attribute of the form element to the value of the form’s id.
    • A form control can only be associated with a single <form>.
    • Warningform="" disassociates a form control from all forms. To set a form element to its default state, you must remove the attribute altogether removeAttribute('form'), instead of setting the value of the form attribute to an empty string.
    • Valid on <input>, <button>, <textarea>, <select>, <label>, <keygen>, <output> and <fieldset>.

Our Cookie Policy and Privacy Policy outline how we use cookies to help optimize service, personalize content, tailor and measure our marketing, and improve your user experience. I agree to use of cookies for these purposes.