Atributo de formulario HTML


Definición y uso

El formatributo especifica la forma a la que pertenece el elemento.

El valor de este atributo debe ser igual al idatributo de un <form> elemento en el mismo documento.


Se aplica a

El formatributo se puede utilizar en los siguientes elementos:

Elementos Atributo
<botón> formulario
<conjunto de campos> formulario
<entrada> formulario
<etiqueta> formulario
<metro> formulario
<objeto> formulario
<salida> formulario
<seleccionar> formulario
<área de texto> formulario

Ejemplos

Ejemplo de botón

Un botón ubicado fuera de un formulario (pero que sigue siendo parte del formulario):

<form action="/action_page.php" method="get" id="form1">
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br>
</form>

<button type="submit" form="form1" value="Submit">Submit</button>

Ejemplo de conjunto de campos

Un elemento <fieldset> ubicado fuera de un formulario (pero que sigue siendo parte del formulario):

<form action="/action_page.php" method="get" id="form1">
  What is your favorite color? <input type="text" name="fav_color"><br>
  <input type="submit">
</form>

<fieldset form="form1">
  Name: <input type="text" name="username"><br>
  Email: <input type="text" name="usermail"><br>
</fieldset>

Ejemplo de entrada

Un campo de entrada ubicado fuera del formulario HTML (pero que sigue siendo parte del formulario):

<form action="/action_page.php" id="form1">
  First name: <input type="text" name="fname"><br>
  <input type="submit" value="Submit">
</form>

Last name: <input type="text" name="lname" form="form1">

Ejemplo de etiqueta

Un elemento <label> ubicado fuera de un formulario (pero que sigue siendo parte del formulario):

<form action="/action_page.php" id="form1">
  <input type="radio" id="html" name="fav_language" value="HTML"><br>
  <input type="radio" id="css" name="fav_language" value="CSS">
  <label for="css">CSS</label><br>
  <input type="radio" id="javascript" name="fav_language" value="JavaScript">
  <label for="javascript">JavaScript</label><br><br>
  <input type="submit" value="Submit">
</form>

<label for="html">HTML</label>

Ejemplo de medidor

Un elemento <meter> ubicado fuera de un formulario (pero que sigue siendo parte del formulario):

<form action="/action_page.php" method="get" id="form1">
  First name: <input type="text" name="fname"><br>
  <input type="submit" value="Submit">
</form>

<meter form="form1" name="x1" min="0" low="40" high="90" max="100" value="95"></meter>

Ejemplo de objeto

Un elemento <object> ubicado fuera de un formulario (pero que sigue siendo parte del formulario):

<form action="/action_page.php" id="form1">
  First name: <input type="text" name="fname"><br>
  <input type="submit" value="Submit">
</form>

<object data="helloworld.swf" height="400" width="400" form="form1" name="obj1"></object>

Ejemplo de salida

Un elemento <output> ubicado fuera de un formulario (pero que sigue siendo parte del formulario):

<form action="/action_page.php" id="numform"
oninput="x.value=parseInt(a.value)+parseInt(b.value)">0
<input type="range" id="a" name="a" value="50">100
+<input type="number" id="b" name="b" value="50">
<br><br>
<input type="submit">
</form>

<output form="numform" name="x" for="a b"></output>

Seleccionar ejemplo

Una lista desplegable ubicada fuera de un formulario (pero que aún forma parte del formulario):

<form action="/action_page.php" id="carform">
  Firstname:<input type="text" name="fname">
  <input type="submit">
</form>

<select name="carlist" form="carform">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>

Ejemplo de área de texto

Un área de texto ubicada fuera de un formulario (pero que sigue siendo parte del formulario):

<form action="/action_page.php" id="usrform">
  Name: <input type="text" name="usrname">
  <input type="submit">
</form>

<textarea name="comment" form="usrform">Enter text here...</textarea>

Compatibilidad con navegador

El formatributo tiene el siguiente soporte de navegador para cada elemento:

Element
button 10.0 Not supported 4.0 5.1 9.5
fieldset Not supported Not supported Not supported Not supported Not supported
input 9.0 Not supported 4.0 5.1 10.6
label Yes Yes Yes Yes Yes
meter Not supported Not supported Not supported Not supported Not supported
object Not supported Not supported Not supported Not supported Not supported
output Yes Not supported Yes Yes Yes
select Yes Not supported Yes Yes Yes
textarea Yes Not supported Yes Yes Yes