The form Attribute

Live Demo

Outside the form

Firefox 4+	Safari 5.1+	Safari iOS 5+	Chrome 10+	Opera 9.5+	IE 11+	Android 4.0+

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>.
  • Warning: form="" 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>.