Formularios¶
A la hora de enviar un formulario, debemos tener claro cuándo usar GET o POST.
-
GET
: los parámetros se pasan en la URL- Máximo de 2048 caracteres y solo en ASCII.
- Permite almacenar la dirección completa en el marcador o historial.
- Es idempotente: dos llamadas con los mismos datos siempre deben dar el mismo resultado.
- El navegador puede almacenar en caché las llamadas.
-
POST
: los parámetros se envían de manera oculta (aunque no encriptada).- Sin límite de datos, permite datos binarios.
- No se puede almacenar en caché.
- No es idempotente: puede provocar cambios, como actualizar la base de datos.
Para recoger los datos, accedemos al array adecuado dependiendo del método del formulario:
<?php
$par = $_GET["parametro_get"]
$par = $_POST["parametro_post"]
Para los siguientes apartados, utilizaremos el siguiente ejemplo de formulario:
<form action="formulario.php" method="GET">
<p><label for="nombre">Nombre del alumno:</label>
<input type="text" name="nombre" id="nombre" value="" />
</p>
<p><input type="checkbox" name="modulos[]" id="modulosDWES" value="DWES" />
<label for="modulosDWES">Desarrollo web en entorno servidor</label>
</p>
<p><input type="checkbox" name="modulos[]" id="modulosDWEC" value="DWEC" />
<label for="modulosDWEC">Desarrollo web en entorno cliente</label>
</p>
<input type="submit" value="Enviar" name="enviar" />
</form>
Validación¶
Para la validación, es importante implementar validación doble:
- En el cliente, mediante JavaScript.
- En el servidor, antes de procesar la lógica de negocio, conviene volver a validar los datos para seguridad.
<?php
if (isset($_GET["parametro_get"])) {
$par = $_GET["parametro_get"];
// comprobar si $par tiene el formato adecuado, su valor, etc...
}
Librerías de validación
Existen diversas librerías que facilitan la validación de los formularios, como respect/validation o particle/validator.
Cuando estudiemos Laravel, profundizaremos en la validación de forma declarativa.
Parámetro multivalor¶
Algunos elementos HTML, como select multiple
o checkbox
, envían múltiples valores. Para recoger los datos de estos elementos, el nombre debe ser un array.
<select name="lenguajes[]" multiple="true">
<option value="c">C</option>
<option value="java">Java</option>
<option value="php">PHP</option>
<option value="python">Python</option>
</select>
<input type="checkbox" name="lenguajes[]" value="c" /> C<br />
<input type="checkbox" name="lenguajes[]" value="java" /> Java<br />
<input type="checkbox" name="lenguajes[]" value="php" /> Php<br />
<input type="checkbox" name="lenguajes[]" value="python" /> Python<br />
Para recuperar los datos:
<?php
$lenguajes = $_GET["lenguajes"];
foreach ($lenguajes as $lenguaje) {
echo "$lenguaje <br />";
}
Volviendo a rellenar un formulario¶
Un sticky form es un formulario que conserva los valores ingresados. Para lograr esto, rellenamos los atributos value
de los elementos HTML con la información previa:
<?php
if (!empty($_POST['modulos']) && !empty($_POST['nombre'])) {
// Aquí se incluye el código a ejecutar cuando los datos son correctos
} else {
// Generamos el formulario
$nombre = $_POST['nombre'] ?? "";
$modulos = $_POST['modulos'] ?? [];
?>
<form action="<?php echo $_SERVER['PHP_SELF'];?>" method="POST">
<p><label for="nombre">Nombre del alumno:</label>
<input type="text" name="nombre" id="nombre" value="<?= $nombre ?>" />
</p>
<p><input type="checkbox" name="modulos[]" id="modulosDWES" value="DWES"
<?php if(in_array("DWES",$modulos)) echo 'checked="checked"'; ?> />
<label for="modulosDWES">Desarrollo web en entorno servidor</label>
</p>
<p><input type="checkbox" name="modulos[]" id="modulosDWEC" value="DWEC"
<?php if(in_array("DWEC",$modulos)) echo 'checked="checked"'; ?> />
<label for="modulosDWEC">Desarrollo web en entorno cliente</label>
</p>
<input type="submit" value="Enviar" name="enviar"/>
</form>
<?php } ?>
Subiendo archivos¶
Los archivos subidos se almacenan en el servidor en el array $_FILES
, en la clave correspondiente al campo de tipo file
del formulario.
<form enctype="multipart/form-data" action="<?php echo $_SERVER['PHP_SELF']; ?>" method="POST">
Archivo: <input name="archivoEnviado" type="file" />
<br />
<input type="submit" name="btnSubir" value="Subir" />
</form>
Configuración en php.ini
file_uploads
: on / offupload_max_filesize
: 2Mupload_tmp_dir
: directorio temporal (si no se configura, toma el predeterminado del sistema).post_max_size
: tamaño máximo de los datosPOST
, mayor queupload_max_filesize
.max_file_uploads
: número máximo de archivos que se pueden cargar simultáneamente.max_input_time
: tiempo máximo para recibir datos (normalmente 60 segundos).memory_limit
: 128Mmax_execution_time
: tiempo de ejecución máximo del script (no incluye la carga de archivos).
Para procesar archivos subidos, accedemos a $_FILES
:
<?php
if (isset($_POST['btnSubir']) && $_POST['btnSubir'] == 'Subir') {
if (is_uploaded_file($_FILES['archivoEnviado']['tmp_name'])) {
// subido con éxito
$nombre = $_FILES['archivoEnviado']['name'];
move_uploaded_file($_FILES['archivoEnviado']['tmp_name'], "./uploads/{$nombre}");
echo "<p>Archivo $nombre subido con éxito</p>";
}
}
Cada archivo cargado en $_FILES
tiene:
name
: nombretmp_name
: ruta temporalsize
: tamaño en bytestype
: tipo MIME1error
: indica si ocurrió un error; si fue exitoso, muestra 0.
Actividades¶
-
AC 402. (RA4 / CE4a CE4b / IC1 / 3p) - Utilizando el paso por parámetros
GET
, se solicita la creación de un formulario con los siguientes campos:- Nombre y apellidos.
- Email.
- URL página personal.
- Sexo (radio).
- Número de convivientes en el domicilio.
- Aficiones (checkboxes) – poner mínimo 4 valores.
- Menú favorito (lista selección múltiple) – poner mínimo 4 valores.
Se han de formatear los valores obtenidos en una tabla-resumen.
-
AC 403. (RA4 / CE4a CE4b / IC1 / 3p) - Utilizando el paso por parámetros
POST
, duplica la AC 402 y realiza las siguientes acciones:- Elimina la URL de la página personal y los convivientes en el domicilio.
- Añade los cubiertos que necesita el usuario.
Se han de formatear los valores obtenidos en una tabla-resumen.
-
AR 404. (RA4 / CE4a CE4b / IC1 / 3p) - Una vez que se ha trabajado con formularios, un compañero solicita que, a partir del formulario anterior, se introduzcan validaciones en HTML mediante el atributo
required
de los campos (uso los tipos adecuados para cada campo), y se compruebe los tipos de los datos y que cumplen los valores esperados (por ejemplo, en los checkboxes que los valores recogidos forman parte de todos los posibles). Se puede probar a pasar datos erróneos via URL y comprobar su comportamiento.Ayuda
Investiga el uso de la función
filter_var
. -
PR 405. (RA4 / CE4a CE4b / IC2 / 5p) - El CTO solicita crear un formulario que permita subir un archivo al servidor para una futura implementación del proyecto. Además del fichero, se debe solicitar en el mismo formulario dos campos numéricos que soliciten la anchura y la altura. Se solicita la comprobación de que tanto el fichero como los datos llegan correctamente.
-
AP 406. (RA4 / CE4a CE4b / IC1 / 3p) - Ahora, se solicita una modificación sobre el ejercicio anterior para que únicamente se permita subir imágenes. Si el usuario selecciona otro tipo de archivos, se le debe informar del error y permitir que suba un nuevo archivo. En el caso de subir el tipo correcto, visualizar la imagen con el tamaño de anchura y altura recibido como parámetro.
-
Forma estandarizada de indicar la naturaleza y el formato de un documento, archivo o conjunto de datos. Puedes encontrar la lista más actualizada y completa en la página de tipos de medios (Media Types) ↩