FORMULARIOS
Un formulario sencillo con dos campos a rellenar y un botón para enviar en HTML es de la siguiente forma:
<html>
<body>
<form action="formpost.php" method="post">
Nombre: <input type="text" name="nombre"><br>
Email: <input type="text" name="email"><br>
<input type="submit" value="Enviar">
</form>
</body>
</html>
Cuando un usuario rellena los datos y hace click en enviar, los datos del formulario se envían para ser procesados al archivo formpost.php. Los datos se envían a través de HTTP con el método HTTP Post.
Una vez los datos están en formpost.php pueden mostrarse, guardarse en una base de datos o lo que se necesite. En formpost.php vamos a mostrarlos con echo:
<html> <body> Hola <?php echo $_POST["nombre"]; ?><br> Tu email es: <?php echo $_POST["email"]; ?></body> </html>
Elemento Descripción
input type="text" Caja de texto
input type="password" Caja de texto donde se muestran asteriscos en lugar de los caracteres escritos
input type="checkbox" Cajas seleccionables que permite escoger múltiples opciones
input type="radio" Cajas seleccionables en grupos que sólo permiten escoger una opción
input type="submit" Botón para enviar el formulario
input type="file" Cajas de texto y botón que permite subir archivos
input type="hidden" Elemento escondido. Especialmente útil para tokens de seguridad
option Una opción posible dentro de un elemento element
select Lista de opciones de elementos option
textarea Texto multilínea
4. Validación<h2>Formulario:</h2>
<form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="post">
Nombre:
<input type="text" name="nombre" maxlength="50"><br>
Contraseña:
<input type="password" name="password"><br>
Educacion:
<select name="educacion">
<option value="sin-estudios">Sin estudios</option>
<option value="educacion-obligatoria" selected="selected">Educación Obligatoria</option>
<option value="formacion-profesional">Formación profesional</option>
<option value="universidad">Universidad</option>
</select> <br>
Nacionalidad:
<input type="radio" name="nacionalidad" value="hispana">Hispana</input>
<input type="radio" name="nacionalidad" value="otra">Otra</input><br>
Idiomas:
<input type="checkbox" name="idiomas[]" value="español" checked="checked">Español</input>
<input type="checkbox" name="idiomas[]" value="inglés">Inglés</input>
<input type="checkbox" name="idiomas[]" value="francés">Francés</input>
<input type="checkbox" name="idiomas[]" value="aleman">Alemán</input><br>
Email:
<input type="text" name="email"><br>
Sitio Web:
<input type="text" name="sitioweb"><br>
// Botón de enviar
<input type="submit" name="submit" value="Enviar">
</form>
</body>
</html>
Vamos a ver los aspectos más característicos:
El atributo maxlength limita el número de caracteres para una caja de texto.
Contraseña es del tipo password, lo que permite ocultar los caracteres con * cuando se escribe.
Educación es un elemento select, que permite seleccionar options en una lista. El texto en el atributo value es el que se enviará a través del formulario. El atributo selected permite mostrar el seleccionado por defecto.
Nacionalidad es del tipo radio, los elementos radio del mismo grupo han de tener un único atributo name y sólo se puede seleccionar uno.
Los idiomas están en un elemento checkbox, que permite enviar varios datos en forma de array si se indica en el atributo name con corchetes. Se puede añadir un atributo checked como seleccionado por defecto.
En action se ha puesto _<?php echo htmlespecialchars($_SERVER["PHPSELF"]); ?>. $_SERVER["PHP_SELF"] es una superglobal que devuelve el nombre del archivo en el que se encuentra el formulario, lo que hace que los datos se envíen al mismo archivo, en lugar de llevarlos a otro archivo para tratarlos. Si se emplea esta forma de indicar el archivo para action, es necesario usar la función htmlespecialchars(), que convierte caracteres especiales en entidades HTML previniendo posibles ataques Cross-site
Primero vamos a crear un filtrado común para todos los campos con la función filtrado():
function filtrado($datos){
$datos = trim($datos); // Elimina espacios antes y después de los datos
$datos = stripslashes($datos); // Elimina backslashes \
$datos = htmlspecialchars($datos); // Traduce caracteres especiales en entidades HTML
return $datos;
Esta función se aplicaría a cada campo a la hora de recibir los datos:
if(isset($_POST["submit"]) && $_SERVER["REQUEST_METHOD"] == "POST"){ $nombre = filtrado($_POST["nombre"]); $password = filtrado($_POST["password"]); $educacion = filtrado($_POST["educacion"]); $nacionalidad = filtrado($_POST["nacionalidad"]); // Utilizamos implode para pasar el array a string $idiomas = filtrado(implode(", ", $_POST["idiomas"])); $email= filtrado($_POST["email"]); $sitioweb = filtrado($_POST["sitioweb"]);
Cuando un usuario rellena los datos y hace click en enviar, los datos del formulario se envían para ser procesados al archivo formpost.php. Los datos se envían a través de HTTP con el método HTTP Post.
Una vez los datos están en formpost.php pueden mostrarse, guardarse en una base de datos o lo que se necesite. En formpost.php vamos a mostrarlos con echo:
<html>
<body>
Hola <?php echo $_POST["nombre"]; ?><br>
Tu email es: <?php echo $_POST["email"]; ?>
</body>
</html>
Para aceptar los datos se ha puesto _isset($POST["submit"]), que crea la key submit cuando se hace click en el botón, y _$_SERVER["REQUESTMETHOD"] == "post", que especifica que el método request ha de ser POST. Se puede usar una de las dos formas o las dos a la vez.
Para mostrar los datos:
<?php if(isset($_POST["submit"])): ?> <h2>Mostrar datos enviados</h2> Nombre : <?phpisset($nombre) ? print $nombre : ""; ?> <br> Contraseña : <?php isset($password) ? print $password: ""; ?> <br> Educación : <?php isset($educacion) ? print $educacion : ""; ?> <br> Nacionalidad : <?php isset($nacionalidad) ? print $nacionalidad : "";?> <br> Idiomas : <?php isset($idiomas) ? print $idiomas : ""; ?> <br> Email : <?php isset($email) ? print $email : ""; ?> <br> Sitio web : <?php isset($sitioweb) ? print $sitioweb : ""; ?> <br> <?php endif; ?>
Todos los campos anteriores son opcionales. La validación más básica consiste en exigir que se rellene un campo, y comprobaremos también que el email tiene un formato de email, que el sitio web es una URL correcta y que passwordtiene un mínimo de 5 caracteres. Las validaciones de formatos pueden realizarse mediante expresiones regulares o con filtros. Siempre que sea posible, es mejor utilizar los filtros de PHP.
if(isset($_POST["submit"]) && $_SERVER["REQUEST_METHOD"] == "POST"){
// El nombre y contraseña son campos obligatorios
if(empty($_POST["nombre"])){
$errores[] = "El nombre es requerido";
}
if(empty($_POST["password"]) || strlen($_POST["password"]) < 5){
$errores[] = "La contraseña es requerida y ha de ser mayor a 5 caracteres";
}
// El email es obligatorio y ha de tener formato adecuado
if(!filter_var($_POST["email"], FILTER_VALIDATE_EMAIL) || empty($_POST["email"])){
$errores[] = "No se ha indicado email o el formato no es correcto";
}
// El sitio web es obligatorio y ha de tener formato adecuado
if(!filter_var($_POST["sitioweb"], FILTER_VALIDATE_URL) || empty($_POST["sitioweb"])){
$errores[] = "No se ha indicado sitio web o el formato no es correcto";
}
// Si el array $errores está vacío, se aceptan los datos y se asignan a variables
if(empty($errores)) {
$nombre = filtrado($_POST["nombre"]);
$password = filtrado($_POST["password"]);
$educacion = filtrado($_POST["educacion"]);
$nacionalidad = filtrado($_POST["nacionalidad"]);
// Utilizamos implode para pasar el array a string
$idiomas = filtrado(implode(", ", $_POST["idiomas"]));
$email = filtrado($_POST["email"]);
$sitioweb = filtrado($_POST["sitioweb"]);
}
}
El array de errores $errores guarda cada uno de los errores que se registran para luego mostrarlos. Si el array tiene algún elemento, el formulario no será aceptado. Para mostrarlos podemos hacerlo así:
<ul> <?php if(isset($errores)){ foreach ($errores as $error){ echo "<li> $error </li>"; } } ?></ul>
. Subida de archivos
Lo más laborioso a la hora de hacer un formulario que permita la subida de archivos es manejarlos y organizarlos una vez están en el servidor. Inicialmente los archivos se suben a un directorio temporal y luego se relocalizan.
Configuración en PHP para la subida de archivos:
Debe estar On la variable file_uploads en php.ini.
En php.ini también se encuentra la variable upload_tmp_dir, que indica el directorio donde se dirigirán los archivos cuando se suban. El tamaño máximo viene indicado en el mismo archivo de configuración por upload_max_filesize. Para ver estos valores se puede utilizar ini_get('upload_tmp_dir') e ini_get('upload_max_filesize'). upload_tmp_dir sólo es manipulable desde el php.ini o httpf.conf, upload_max_filesize puede también desde .htaccess o un user.ini (tienen modo PHP_INI_SYSTEM y PHP_INI_PERDIR respectivamente).
Es necesario que los permisos tanto del directorio temporal como del directorio final sean de escritura.
Para que un formulario tenga la capacidad de aceptar archivos se añade el atributo enctype="multipart/form-data" al elemento form.
De nuevo en este ejemplo pondremos todo el contenido en un archivo form2.php:
<h2>Formulario subida de archivos</h2> <html> <body> <form action="<?php echohtmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="POST" enctype="multipart/form-data"> <inputtype="hidden" name="MAX_FILE_SIZE" value="<?php echo $max_file_size; ?>" /> <input type="file"name="imagen" /> <input type="submit" name="submit" /> </form> </body> </html>
Se incluye un input del tipo hidden que limita el tamaño máximo del archivo que se puede subir (en bytes).
La información sobre un archivo subido la proporciona el array multidimensional $_FILES. Este array se crea con el keyque se indique en el input del formulario, en este caso "imagen":
$_FILES["imagen"]["name"]. Guarda el nombre original del archivo del cliente.
$_FILES["imagen"]["type"]. Guarda el MIME type del archivo.
$_FILES["imagen"]["size"]. Guarda el tamaño del archivo en bytes.
$_FILES["imagen"]["tmp_name"]. Guarda el nombre del archivo temporal.
$_FILES["imagen"]["error"]. Guarda cualquier código de error que pueda provocar la subida del archivo.
La función move_uploaded_file() mueve un archivo subido del directorio temporal al directorio que se indique.
$directorioSubida = "uploads/";
$max_file_size = "51200";
$extensionesValidas = array("jpg", "png", "gif");
if(isset($_POST["submit"]) && isset($_FILES['imagen'])){
$errores = array();
$nombreArchivo = $_FILES['imagen']['name'];
$filesize = $_FILES['imagen']['size'];
$directorioTemp = $_FILES['imagen']['tmp_name'];
$tipoArchivo = $_FILES['imagen']['type'];
$arrayArchivo = pathinfo($nombreArchivo);
$extension = $arrayArchivo['extension'];
// Comprobamos la extensión del archivo
if(!in_array($extension, $extensionesValidas)){
$errores[] = "La extensión del archivo no es válida o no se ha subido ningún archivo";
}
// Comprobamos el tamaño del archivo
if($filesize > $max_file_size){
$errores[] = "La imagen debe de tener un tamaño inferior a 50 kb";
}
// Comprobamos y renombramos el nombre del archivo
$nombreArchivo = $arrayArchivo['filename'];
$nombreArchivo = preg_replace("/[^A-Z0-9._-]/i", "_", $nombreArchivo);
$nombreArchivo = $nombreArchivo . rand(1, 100);
// Desplazamos el archivo si no hay errores
if(empty($errores)){
$nombreCompleto = $directorioSubida.$nombreArchivo.".".$extension;
move_uploaded_file($directorioTemp, $nombreCompleto);
print "El archivo se ha subido correctamente";
}
}
El array $_FILES['imagen']['error'] especifica por qué no se ha podido subir el archivo, lo que permite especificar un mensaje de vuelta para cada tipo de error. Devuelve un integer con el número de error:
Error Valor Significado
UPLOAD_ERR_OK 0 No hay errores
UPLOAD_ERR_INI_SIZE 1 Supera el tamaño máximo indicado en php.ini
UPLOAD_ERR_FORM_SIZE 2 Supera el tamaño máximo indicado en MAX_FILE_SIZE de html
UPLOAD_ERR_PARTIAL 3 Sólo se ha subido el archivo parcialmente
UPLOAD_ERR_NO_FILE 4 No se ha subido ningún archivo
UPLOAD_ERR_NO_TMP_DIR 6 Falta la carpeta temporal
UPLOAD_ERR_CANT_WRITE 7 No se puede escribir en el directorio especificado
UPLOAD_ERR_EXTENSION 8 Una extensión de PHP ha detenido la subida
6. Subida múltiple de archivos
Una subida múltiple de archivos en PHP en la práctica se hace normalmente con ayuda de JavaScript. Una buena librería para subir archivos es DropzoneJS.
En el formulario HTML lo único que cambia es que se añade un atributo multiple y que en el atributo name del input file se añade corchetes para indicar que es un array:
<input type="file" name="imagenes[]" multiple="multiple" />
En cuanto al backend, omitiendo validaciones esta puede ser una forma de hacerlo:
$directorioSubida = "uploads/";
$max_file_size = "51200";
if(isset($_POST["submit"]) && isset($_FILES['imagenes'])){
$nombres = $_FILES['imagenes']['name'];
$temporales = $_FILES['imagenes']['tmp_name'];
$tipos = $_FILES['imagenes']['type'];
$errores = $_FILES['imagenes']['error'];
// Iteramos sobre los arrays creados
for ($i = 0; $i < count($temporales); $i++){
if(move_uploaded_file($temporales[$i], $directorioSubida.$nombres[$i])){
echo "Se ha subido {$nombres[$i]} correctamente <br>";
} else {
echo "Ha habido algún error al subir algún archivo";
}
}
}
https://diego.com.es/formularios-en-php
FECHA: AGOSTO 8 2017
No hay comentarios.:
Publicar un comentario