Múltiples envíos para un formulario. Campo oculto OCULTO. Deshabilitar o habilitar el botón de enviar

Con la llegada de HTML5, los formularios se han vuelto más versátiles. El elemento de entrada ahora puede contener direcciones de correo electrónico, fechas y más, se pueden marcar según sea necesario sin recurrir a javascript, y estas son solo algunas de las características más valiosas. Además, ahora puede utilizar varios botones de envío para un formulario y ahora es posible mover el botón de envío fuera del formulario.

Múltiples envíos dentro de un formulario

Hasta hace poco, solo se podía insertar un botón de envío en un formulario; de lo contrario, el formulario solo procesaría el último botón. Al agregar método="post" y url al elemento de formulario "formulario", obtuvimos un formulario funcional.

Ahora la situación ha cambiado: se han agregado nuevas propiedades "formmethod" y "formaction" al HTML. Le permiten agregar un método de publicación y una URL directamente al botón "enviar", por lo que no necesita agregar nada al formulario. Tener estos parámetros adjuntos al botón "enviar" en lugar de al formulario agrega más flexibilidad al formulario. Ahora puedes crear tantos botones como necesites para el formulario.

Ahora cada botón "enviar" pertenece a diferentes URL y todo esto elimina la necesidad de escribir código javascript. Todo esto funciona muy bien y ahora, cuando haces clic en un botón, el formulario recibirá el método de formulario y la formación, que se sobrescribirán. parámetros estándar método y acción. Si el formulario contiene un botón normal de "enviar" sin nuevos parámetros, devolverá los valores del formulario establecidos para el elemento del formulario.

El método de forma y las propiedades de formación son compatibles con todos navegadores populares

Elementos de formulario (entrada, selección, área de texto) fuera del formulario

Es un hecho generalmente aceptado que todos los elementos de una forma que le pertenecen deben estar ubicados dentro de un elemento.

. Esto reduce la flexibilidad en el diseño de los propios formularios. Gracias al nuevo atributo "formulario", ahora cualquier elemento se puede mover fuera del formulario y cualquier elemento del formulario se puede colocar en cualquier parte de la página. Para ello sólo necesitas un formulario agregue una ID y luego agregue el valor de esa ID a todos los elementos como un atributo.

Hoy en día, el atributo de formulario es compatible con todos los navegadores populares, con la excepción de Explorador de Internet(hasta la versión 10).

El formulario en sí generalmente está destinado a recibir información del usuario para enviarla al servidor, donde el programa de procesamiento recibe los datos del formulario. Un programa de este tipo se puede escribir en cualquier lenguaje de programación del lado del servidor como PHP, Perl, etc. La dirección del programa se indica en el atributo de acción de la etiqueta.

, como se muestra en el ejemplo 1.

Ejemplo 1: envío de datos del formulario

HTML5 IE Cr Op Sa Fx

datos del formulario



En este ejemplo, los datos del formulario indicados por el atributo de nombre (nombre de usuario y contraseña) se pasarán al archivo en /example/handler.php. Si no se especifica el atributo de acción, la transferencia se produce a la dirección de la página actual.

La transferencia al servidor se produce en dos diferentes metodos: GET y POST, para establecer un método en una etiqueta

Se utiliza el atributo de método y sus valores son las palabras clave get y post. Si no se especifica el atributo del método, de forma predeterminada los datos se envían al servidor mediante el método GET. en la mesa La Figura 1 muestra las diferencias entre estos métodos.

El método utilizado se puede determinar fácilmente mediante la barra de direcciones del navegador. si apareciera signo de interrogación y la dirección se ve así, entonces definitivamente es un GET.

http://www.google.ru/search?q=%D1%81%D0%B8%D1%81%D1%8C%D0%BA%D0%B8&ie=utf-8

Una combinación única de parámetros en la barra de direcciones identifica de forma única una página, por lo que las páginas con direcciones ?q=node/add y ?q=node se consideran diferentes. Esta función la utilizan los sistemas de gestión de contenidos (CMS, sistema de gestión de contenidos) para crear muchas páginas de sitios web. En realidad, se utiliza un archivo, que recibe OBTENER solicitud y según él se forma el contenido del documento.

A continuación se enumeran las aplicaciones típicas de estos métodos en los sitios.

CONSEGUIR

Transferir pequeños datos de texto al servidor; búsqueda del sitio.

Los motores de búsqueda y los formularios de búsqueda de sitios siempre se envían mediante el método GET, esto le permite compartir los resultados de la búsqueda con amigos, enviar un enlace por correo o publicarlo en un foro.

CORREO

Transferir archivos (fotos, archivos, programas, etc.); enviar comentarios; Agregar y editar mensajes en el foro, blog.

De forma predeterminada, el formulario se procesa en la pestaña actual del navegador; sin embargo, al enviar el formulario, puede cambiar este parámetro y abrir el controlador del formulario en una nueva pestaña o marco. Este comportamiento se especifica a través del “nombre de contexto”, que es el valor atributo objetivo etiqueta . Los valores populares son _en blanco para abrir el formulario en una nueva ventana o pestaña, y el nombre del marco, que se especifica mediante el atributo nombre de etiqueta



En este ejemplo, cuando hace clic en el botón Enviar, el resultado del envío del formulario se abre en un marco llamado área.

Los elementos del formulario tradicionalmente se colocan dentro de una etiqueta.

, determinando así los datos que se transmitirán al servidor. Al mismo tiempo, HTML5 tiene la capacidad de separar un formulario de sus elementos. Esto se hace por conveniencia y versatilidad, por lo que un diseño complejo puede contener varios formularios que no deben cruzarse entre sí o, por ejemplo, algunos elementos se muestran mediante scripts en un lugar de la página y el formulario en sí se encuentra en otro. . La conexión entre el formulario y sus elementos se produce en este caso a través del identificador del formulario, y los elementos deben agregarse atributo de formulario con un valor igual a este identificador (ejemplo 3).

Ejemplo 3: vincular un formulario a campos

HTML5 IE Cr Op Sa Fx

Forma



En este ejemplo la etiqueta

se identifica de forma única a través del identificador de autenticación y form="auth" se agrega a los campos que deben enviarse a través del formulario. En este caso, el comportamiento de los elementos no cambia; cuando se hace clic en el botón, el nombre de usuario y la contraseña se envían al controlador handler.php.

Aunque los parámetros de transferencia de formulario se especifican tradicionalmente en la etiqueta , también se pueden transferir a los botones de envío del formulario (

Esto es lo que pasó:

Botón con texto Enviar
  • Botón ENTREGAR- diseñado para enviar datos al servidor. Su apariencia no es diferente de otros botones, pero cuando haces clic en él, se ejecuta. programa de servidor, especificado por el parámetro acción etiqueta FORMA. Este programa, también llamado controlador de formulario, recibe los datos ingresados ​​por el usuario en los campos del formulario, realiza las manipulaciones necesarias con ellos y luego devuelve el resultado en forma de documento HTML. Lo que hace exactamente el controlador depende del autor del sitio; Así, se utiliza tecnología similar para crear encuestas, foros, libros de visitas, pruebas y muchas otras cosas.



El navegador mostrará:

  • Botón REINICIAR- cuando presionas un botón REINICIAR los datos del formulario se devuelven a su valor original. Normalmente, este botón se utiliza para borrar la información ingresada en los campos del formulario. Pero para formularios grandes, use un botón. REINICIAR Es mejor rechazarlo por completo para no hacer clic en él por error, porque entonces tendrás que volver a rellenar el formulario.

A continuación se muestra un formulario con uno campo de texto que ya contiene texto previamente ingresado usando el parámetro valor etiqueta APORTE. Después de cambiar el texto y hacer clic en el botón "Borrar", el valor del campo se restaurará y aparecerá nuevamente el mensaje "Ingresar texto".





Veamos el código formularios html en la pantalla del navegador: Este campo tiene tres parámetros principales: nombre, valor Y comprobado:

  • nombre- identifica de forma única el campo; además, dado que los botones de opción son elementos de grupo, el nombre de todos los elementos del grupo debe ser el mismo. Este enfoque establece sin ambigüedades que un campo pertenece a un grupo específico.
  • valor- especifica qué valor se enviará al servidor. Aquí, cada elemento debe tener su propio valor único para que se pueda identificar qué elemento fue seleccionado por el usuario.
  • comprobado- Se utiliza para preseleccionar un elemento de la lista.

Por definición, un conjunto de botones de opción solo puede tener un elemento seleccionado, por lo que agregar comprobado a varios campos a la vez no conducirá a ningún resultado sobresaliente. En cualquier caso, se marcará el elemento que aparezca en último lugar en el código HTML.


¿Qué es 2+2?
3
4
Oscuridad

En el navegador el formulario se verá así:

¿Qué es 2+2?
3
4
Oscuridad

Casillas de verificación

Casillas de verificación (caja) Se utiliza cuando es necesario seleccionar dos o más opciones de la lista propuesta. Si necesita seleccionar solo una opción, entonces debería preferir los botones de opción (botón de opción).

Los parámetros de las casillas de verificación son idénticos a los de los botones de opción, a saber: nombre especifica el nombre del campo, valor- su valor, un comprobado establece la casilla de verificación como marcada. En este caso, cada checkbox incluido en el grupo se considera independiente, por lo que sus nombres y valores deben ser diferentes.


Con qué sistemas operativos¿Se conocen?
Ventanas 95/98
ventana 2000
Sistema X
linux
X3-DOS

Se mostrará el navegador.

A menudo, en los sitios web se pueden encontrar páginas con formularios HTML. Formularios web – manera conveniente obtener información de los visitantes de su sitio. Un ejemplo de esto es - , - que proporciona comentario con los visitantes y desarrolladores del sitio. Los formularios también son convenientes para los desarrolladores de sitios cuando desarrollan un CMS, lo que les permite mantener la propiedad principal del sitio: la relevancia. Este artículo está dedicado a los conceptos básicos de la creación de formularios HTML, su procesamiento y las formas de transferir datos desde formularios de pantalla a scripts PHP.

1) Crea un formulario simple

Etiquetas

Y
definir el principio y el final del formulario. Etiqueta de formulario inicial
contiene dos atributos: acción Y método. atributo de acción contiene dirección URL script que debe llamarse para procesar el script. Atributo método le dice al navegador qué tipo solicitud HTTP debe usarse para enviar el formulario; valores posibles CORREO Y CONSEGUIR.

Comentario

La principal diferencia entre los métodos POST y GET es la forma en que se transfiere la información. EN OBTENER método los parámetros se pasan a través de barra de direcciones, es decir. esencialmente en el encabezado de la solicitud HTTP, mientras que en método POST los parámetros se transmiten a través del cuerpo de la solicitud HTTP y no se reflejan de ninguna manera en la barra de direcciones.

$texto = nl2br($_POST["mitexto"]);
?>

Tarea: Supongamos que necesita crear una lista desplegable con años desde 2000 hasta 2050.
Solución: necesidad de crear formulario HTML con el elemento SELECT y PHP – script para procesar el formulario.

Discusión:

Primero, creemos dos archivos: formulario.html Y acción.php. en archivo formulario.html contendrá un formulario html con una lista desplegable. Además, los valores de la lista se pueden especificar de dos formas:

I. Entrada de datos manual:

II. Ingresando datos a través de un bucle:

Como puede ver, el segundo ejemplo con bucle es más compacto. Creo que no es necesario proporcionar el script de controlador para este formulario, porque se procesa exactamente igual que un campo de texto, es decir. los valores de la lista se pueden recuperar de matriz superglobal $_POST.

Descripción:

Creemos un formulario HTML para enviar un archivo al servidor.




Este formulario html contiene un elemento navegar, que abre un cuadro de diálogo para seleccionar un archivo para cargar en el servidor. Cuando presionas el botón "Transferir archivo", el archivo se pasa al script del controlador.

Entonces necesitas escribir un script de controlador. acción.php. Antes de escribir el controlador, debemos decidir en qué directorio copiaremos el archivo:

if(isset($_FILES [ "miarchivo" ])) // Si el archivo existe
{
$catalogo = "../imagen/" ; // Nuestro catálogo
si (is_dir ($ catálogo)) // Si dicho directorio existe
{
$miarchivo = $_FILES [ "miarchivo" ][ "tmp_name" ]; // archivo temporal
$miarchivo_nombre = $_FILES [ "miarchivo" ][ "nombre" ]; // Nombre del archivo
if(! copiar ($miarchivo, $catalogo)) eco "Error al copiar el archivo". $minombre_archivo // Si falla la copia del archivo
}
else mkdir ("../imagen/" ); // Si no existe dicho directorio, lo crearemos
}
?>

Comentario

Si confía en que los usuarios carguen archivos en su servidor, debe tener mucho cuidado. Los atacantes pueden incrustar código "malo" en una imagen o archivo y enviarlo al servidor. En tales casos, es necesario controlar estrictamente la descarga de archivos.

este ejemplo muestra la creación de un directorio y la copia de un archivo en ese directorio en el servidor.

También me gustaría demostrar un ejemplo con el elemento. caja. Este elemento es ligeramente diferente de otros elementos en que si no uno de los elementos caja'a no está seleccionada, entonces la variable superglobal $_POST devolverá un valor vacío:


Azul
Negro
Blanco

if (!empty($_POST [ "micolor" ])) echo $_POST [ "micolor" ]; // Si se selecciona al menos 1 elemento
más eco "Seleccionar valor";
?>

Intenta enviar un formulario al servidor.

Precio

Si decides utilizar elementos


Arriba