HTML Formulario de entrada* Atributos
Este capítulo describe los diferentes atributos form* para el elemento HTML <input>.
El atributo de form
El atributo de entrada form especifica el formulario al que pertenece el elemento <input>.
El valor de este atributo debe ser igual al atributo id del elemento <form> al que pertenece.
Ejemplo
Un campo de entrada ubicado fuera del formulario HTML (pero que sigue siendo parte del formulario):
<form action="/action_page.html" id="form1">
<label for="fname">First name:</label>
<input type="text" id="fname" name="fname"><br><br>
<input type="submit" value="Submit">
</form>
<label for="lname">Last name:</label>
<input type="text" id="lname" name="lname" form="form1">
Inténtalo tú mismo »
El atributo de formaction
El atributo de entrada formaction especifica la URL del archivo que procesará la entrada cuando se envíe el formulario.
Nota: Este atributo anula el atributo action del <form> elemento.
El atributo formaction funciona con los siguientes tipos de entrada: envío e imagen.
Ejemplo
Un formulario HTML con dos botones de envío, con diferentes acciones:
<form action="/action_page.html">
<label for="fname">First name:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Last name:</label>
<input type="text" id="lname" name="lname"><br><br>
<input type="submit" value="Submit">
<input type="submit" formaction="/action_page2.html" value="Submit as Admin">
</form>
Inténtalo tú mismo »
El atributo formenctype
El atributo de entrada formenctype especifica cómo se deben codificar los datos del formulario cuando se envían (solo para formularios con method="post").
Nota: Este atributo anula el atributo enctype del elemento <form>.
El atributo formenctype funciona con los siguientes tipos de entrada: envío e imagen.
Ejemplo
Un formulario con dos botones de envío. El primero envía los datos del formulario con codificación predeterminada, el segundo envía los datos del formulario codificados como "multipart/form-data":
<form action="/action_page_binary.asp" method="post">
<label for="fname">First name:</label>
<input type="text" id="fname" name="fname"><br><br>
<input type="submit" value="Submit">
<input type="submit" formenctype="multipart/form-data"
value="Submit as Multipart/form-data">
</form>
Inténtalo tú mismo »
El atributo del formmethod
El atributo de entrada formmethod define el método HTTP para enviar datos del formulario a la URL de acción.
Nota: Este atributo anula el atributo de método del elemento <form>.
El atributo formmethod funciona con los siguientes tipos de entrada: envío e imagen.
Los datos del formulario se pueden enviar como variables de URL (method="get") o como una transacción posterior HTTP (method="post").
Notas sobre el método "get":
- Este método agrega los datos del formulario a la URL en pares de nombre/valor
- Este método es útil para envíos de formularios en los que un usuario desea marcar el resultado como favorito
- Existe un límite en la cantidad de datos que puede colocar en una URL (varía según el navegador), por lo tanto, no puede estar seguro de que todos los datos del formulario se transferirán correctamente
- ¡Nunca utilices el método "get" para pasar información confidencial! (la contraseña u otra información confidencial será visible en la barra de direcciones del navegador)
Notas sobre el método "post":
- Este método envía los datos del formulario como una transacción posterior HTTP.
- Los envíos de formularios con el método "post" no se pueden marcar como favoritos
- El método "post" es más robusto y seguro que "get", y "post" no tiene limitaciones de tamaño.
Ejemplo
Un formulario con dos botones de envío. El primero envía los datos del formulario con method="get". El segundo envía los datos del formulario con method="post":
<form action="/action_page.html" method="get">
<label for="fname">First name:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Last name:</label>
<input type="text" id="lname" name="lname"><br><br>
<input type="submit" value="Submit using GET">
<input type="submit" formmethod="post" value="Submit using POST">
</form>
Inténtalo tú mismo »
El atributo formtarget
El atributo de entrada formtarget especifica un nombre o una palabra clave que indica dónde mostrar la respuesta que se recibe después de enviar el formulario.
Nota: Este atributo anula el atributo de destino del elemento <form>.
El atributo formtarget funciona con los siguientes tipos de entrada: envío e imagen.
Ejemplo
Un formulario con dos botones de envío, con diferentes ventanas de destino:
<form action="/action_page.html">
<label for="fname">First name:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Last name:</label>
<input type="text" id="lname" name="lname"><br><br>
<input type="submit" value="Submit">
<input type="submit" formtarget="_blank" value="Submit to a new window/tab">
</form>
Inténtalo tú mismo »
El atributo formnovalidate
El atributo de entrada formnovalidate especifica que un elemento <input> no debe validarse cuando se envía.
Nota: Este atributo anula el atributo novalidate del elemento <form>.
El atributo formnovalidate funciona con los siguientes tipos de entrada: submit (enviar).
Ejemplo
Un formulario con dos botones de envío (con y sin validación):
<form action="/action_page.html">
<label for="email">Enter your email:</label>
<input type="email" id="email" name="email"><br><br>
<input type="submit" value="Submit">
<input type="submit" formnovalidate="formnovalidate"
value="Submit without validation">
</form>
Inténtalo tú mismo »
El atributo novalidate
El atributo novalidate es un atributo <form>.
Cuando está presente, novalidate especifica que todos los datos del formulario no deben validarse cuando se envían.
Ejemplo
Especifique que no se deben validar datos del formulario al enviarlos:
<form action="/action_page.html" novalidate>
<label for="email">Enter your email:</label>
<input type="email" id="email" name="email"><br><br>
<input type="submit" value="Submit">
</form>
Inténtalo tú mismo »
HTML Elementos de formulario y entrada
| Etiqueta | Descripción |
|---|---|
| <form> | Define un formulario HTML para la entrada del usuario. |
| <input> | Definir un control de entrada |
Para obtener una lista completa de todas las etiquetas HTML disponibles, visite Referencia de etiquetas HTML en nuestro sitio web W3SchoolsES. ElMejor.
