Este capítulo describe los diferentes atributos para el elemento HTML <form>.

El atributo action

El atributo action define la acción que se realizará cuando se envíe el formulario. Por lo general, los datos del formulario se envían a un archivo en el servidor cuando el usuario hace clic en el botón Enviar. En el siguiente ejemplo, los datos del formulario se envían a un archivo llamado "action_page.php". Este archivo contiene un script del lado del servidor que maneja los datos del formulario:

Ejm

<form action="/action_page.php">
  <label for="fname">First name:</label><br>
  <input type="text" id="fname" name="fname" value="John"><br>
  <label for="lname">Last name:</label><br>
  <input type="text" id="lname" name="lname" value="Doe"><br><br>
  <input type="submit" value="Submit">
</form>

Sugerencia: si se omite el atributo action, la acción se establece en la página actual.

El atributo target

El atributo target especifica dónde mostrar la respuesta que se recibe después de enviar el formulario. El atributo target puede tener uno de los siguientes valores:

Value Description
_blank La respuesta se muestra en una nueva ventana o pestaña
_self La respuesta se muestra en la ventana actual.
_parent La respuesta se muestra en el marco principal.
_top La respuesta se muestra en el cuerpo completo de la ventana.
framename La respuesta se muestra en un iframe con nombre

El valor predeterminado es _self, lo que significa que la respuesta se abrirá en la ventana actual.

Ejm

<form action="/action_page.php" target="_blank">

El atributo method

El atributo method especifica el método HTTP que se utilizará al enviar los datos del formulario. Los datos del formulario se pueden enviar como variables de URL (con method="get") o como transacción de publicación HTTP (con method="post"). El método HTTP predeterminado al enviar datos de formulario es GET.

Ejm

<form action="/action_page.php" method="get">

Notas sobre GET:

  • Agrega los datos del formulario a la URL, en pares de nombre/valor
  • ¡NUNCA uses GET para enviar datos confidenciales! (¡Los datos del formulario enviado son visibles en la URL!)
  • La longitud de una URL es limitada (2048 caracteres)
  • Útil para envíos de formularios en los que un usuario desea marcar el resultado
  • GET es bueno para datos no seguros, como cadenas de consulta en Google

Notas sobre POST:

  • Agrega los datos del formulario dentro del cuerpo de la solicitud HTTP (los datos del formulario enviado no se muestran en la URL)
  • POST no tiene limitaciones de tamaño y se puede utilizar para enviar grandes cantidades de datos.
  • Los envíos de formularios con POST no se pueden marcar

Consejo: ¡siempre usa POST si los datos del formulario contienen información confidencial o personal!

El atributo autocomplete

El atributo autocomplete especifica si un formulario debe tener la opción de autocompletar activada o desactivada.

Cuando autocomplete está activado, el navegador completa automáticamente los valores en función de los valores que el usuario ha ingresado anteriormente.

Ejm

<form action="/action_page.php" autocomplete="on">

El atributo novalidate

El atributo novalidate es un atributo booleano. Cuando está presente, especifica que los datos del formulario (entrada) no deben validarse cuando se envían.

Ejm

<form action="/action_page.php" novalidate>

Listado de todos los atributos form

Attribute Description
accept-charset Especifica las codificaciones de caracteres utilizadas para el envío de formularios.
action Especifica dónde enviar los datos del formulario cuando se envía un formulario
autocomplete Especifica si un formulario debe tener la función de autocompletar activada o desactivada
enctype Especifica cómo se deben codificar los datos del formulario al enviarlos al servidor (solo para method="post")
method Especifica el método HTTP a utilizar al enviar datos de formulario
name Especifica el nombre del formulario.
novalidate Especifica que el formulario no debe validarse cuando se envía
rel Especifica la relación entre un recurso vinculado y el documento actual
target Specifies where to display the response that is received after submitting the form