Formulario HTML: Elementos y Atributos Principales
¿Qué es el elemento <form>?
El elemento <form> en HTML se utiliza para crear formularios interactivos que recopilan
datos del usuario y los envían a un servidor para su procesamiento. Es la base de
cualquier formulario en una página web.
Atributos principales del <form>
1. action: Especifica la URL donde se enviarán los datos del formulario.
Ejemplo: <form action="[Link]">
2. method: Define el método HTTP que se usará para enviar los datos.
- Valores comunes:
* GET: Envía los datos como parte de la URL.
* POST: Envía los datos de manera más segura dentro del cuerpo de la solicitud.
Ejemplo: <form method="post">
3. name: Asigna un nombre al formulario para identificarlo en el lado del cliente.
Ejemplo: <form name="registro">
4. target: Indica dónde se abrirá la respuesta del formulario.
- Valores comunes:
* _self (por defecto): Abre la respuesta en la misma ventana.
* _blank: Abre la respuesta en una nueva pestaña o ventana.
Ejemplo: <form target="_blank">
5. enctype: Define el tipo de codificación de los datos enviados (relevante para
archivos).
Ejemplo: <form enctype="multipart/form-data">
¿Qué es el elemento <textarea>?
El elemento <textarea> se utiliza para crear un campo de entrada de texto de varias
líneas en un formulario. Es útil para recopilar comentarios, descripciones largas o
cualquier texto extenso.
Atributos principales del <textarea>
1. name: Asigna un nombre al campo para identificarlo al enviar los datos.
Ejemplo: <textarea name="comentarios"></textarea>
2. rows: Especifica el número de filas visibles en el área de texto.
Formulario HTML: Elementos y Atributos Principales
Ejemplo: <textarea rows="4"></textarea>
3. cols: Define el número de columnas visibles (ancho) en el área de texto.
Ejemplo: <textarea cols="50"></textarea>
4. placeholder: Muestra un texto en gris claro como pista para el usuario.
Ejemplo: <textarea placeholder="Escribe aquí tus comentarios..."></textarea>
5. maxlength: Establece el número máximo de caracteres que el usuario puede ingresar.
Ejemplo: <textarea maxlength="200"></textarea>
6. required: Indica que el campo debe completarse antes de enviar el formulario.
Ejemplo: <textarea required></textarea>
Ejemplo Práctico
<form action="[Link]" method="post" name="formularioComentario">
<label for="nombre">Nombre:</label>
<input type="text" id="nombre" name="nombre" required>
<label for="comentarios">Comentarios:</label>
<textarea id="comentarios" name="comentarios" rows="4" cols="50"
placeholder="Escribe tu mensaje aquí..." maxlength="200" required></textarea>
<button type="submit">Enviar</button>
</form>