Hola amigos, después de bastante tiempo voy a publicar un tutorial simple pero útil para su sitio web ó proyecto, insertar, seleccionar, actualizar y eliminar (CRUD) una imagen usando una consulta PDO. Ya tenemos un Tutorial sobre CRUD (ABM) pero no hemos visto esto, este tutorial muestra la validación de imagen adecuada, digamos que sólo las extensiones de imagen válidas se permiten subir y el tamaño de la imagen también es importante.
En este ejemplo usamos la base de datos mysql test donde insertamos el sql siguiente ...
CREATE TABLE IF NOT EXISTS `tbl_movil` (
`movil_ID` int(11) NOT NULL AUTO_INCREMENT,
`movil_Marca` varchar(20) NOT NULL,
`movil_Tipo` varchar(50) NOT NULL,
`movil_Img` varchar(200) NOT NULL,
PRIMARY KEY (`movil_ID`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=1;
Ahora tenemos que crear sólo 4 archivos que se encargarán de las operaciones CRUD
Este es el archivo de configuracion y acceso a la base de datos. Edite los datos según su configuración.
<?php
$DB_HOST = 'localhost';
$DB_USER = 'root';
$DB_PASS = '';
$DB_NAME = 'test';
try{
$DB_con = new PDO("mysql:host={$DB_HOST};dbname={$DB_NAME}",$DB_USER,$DB_PASS);
$DB_con->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
}
catch(PDOException $e){
echo $e->getMessage();
}
Simple formulario HTML creado con bootstrap, los campos que he agregado aquí es para un listado de automóviles, ustedes pueden editar como estimen conveniente. Con respecto al código php, se agrega justo antes de la etiqueta <!DOCTYPE html>. en este script se inserta la imagen y sus detalles de texto, está la validación de la imagen y si algún error se produce se mostrará un mensaje apropiado.
<?php
error_reporting( ~E_NOTICE ); // avoid notice
require_once 'dbconfig.php';
if(isset($_POST['btnsave']))
{
$username = $_POST['user_name'];// user name
$userjob = $_POST['user_job'];// user email
$imgFile = $_FILES['user_image']['name'];
$tmp_dir = $_FILES['user_image']['tmp_name'];
$imgSize = $_FILES['user_image']['size'];
if(empty($username)){
$errMSG = "Ingrese la marca";
}
else if(empty($userjob)){
$errMSG = "Ingrese el tipo.";
}
else if(empty($imgFile)){
$errMSG = "Seleccione el archivo de imagen.";
}
else
{
$upload_dir = 'user_images/'; // upload directory
$imgExt = strtolower(pathinfo($imgFile,PATHINFO_EXTENSION)); // get image extension
// valid image extensions
$valid_extensions = array('jpeg', 'jpg', 'png', 'gif'); // valid extensions
// rename uploading image
$userpic = rand(1000,1000000).".".$imgExt;
// allow valid image file formats
if(in_array($imgExt, $valid_extensions)){
// Check file size '1MB'
if($imgSize < 1000000) {
move_uploaded_file($tmp_dir,$upload_dir.$userpic);
}
else{
$errMSG = "Su archivo es muy grande.";
}
}
else{
$errMSG = "Solo archivos JPG, JPEG, PNG & GIF son permitidos.";
}
}
// if no error occured, continue ....
if(!isset($errMSG))
{
$stmt = $DB_con->prepare('INSERT INTO tbl_movil(movil_Marca,movil_Tipo,movil_Img) VALUES(:uname, :ujob, :upic)');
$stmt->bindParam(':uname',$username);
$stmt->bindParam(':ujob',$userjob);
$stmt->bindParam(':upic',$userpic);
if($stmt->execute())
{
$successMSG = "Nuevo registro insertado correctamente ...";
header("refresh:3;index.php"); // redirects image view page after 5 seconds.
}
else
{
$errMSG = "Error al insertar ...";
}
}
}
?>
<form method="post" enctype="multipart/form-data" class="form-horizontal">
<table class="table table-bordered table-responsive">
<tr>
<td><label class="control-label">Marca.</label></td>
<td><input class="form-control" type="text" name="user_name" placeholder="Ingrese la Marca" value="<?php echo $username; ?>" /></td>
</tr>
<tr>
<td><label class="control-label">Modelo.</label></td>
<td><input class="form-control" type="text" name="user_job" placeholder="Ingrese el Modelo" value="<?php echo $userjob; ?>" /></td>
</tr>
<tr>
<td><label class="control-label">Imágen.</label></td>
<td><input class="input-group" type="file" name="user_image" accept="image/*" /></td>
</tr>
<tr>
<td colspan="2"><button type="submit" name="btnsave" class="btn btn-default">
<span class="glyphicon glyphicon-save"></span> guardar
</button>
</td>
</tr>
</table>
</form>
La edición del registro se ejecuta después de buscar en la base de datos, la imagen antigua se eliminara y la nueva será cargada. A continuación únicamente pueden ver el script php.
<?php
error_reporting( ~E_NOTICE );
require_once 'dbconfig.php';
if(isset($_GET['edit_id']) && !empty($_GET['edit_id']))
{
$id = $_GET['edit_id'];
$stmt_edit = $DB_con->prepare('SELECT movil_Marca, movil_Tipo, movil_Img FROM tbl_movil WHERE movil_ID =:uid');
$stmt_edit->execute(array(':uid'=>$id));
$edit_row = $stmt_edit->fetch(PDO::FETCH_ASSOC);
extract($edit_row);
}
else
{
header("Location: index.php");
}
if(isset($_POST['btn_save_updates']))
{
$username = $_POST['user_name'];// user name
$userjob = $_POST['user_job'];// user email
$imgFile = $_FILES['user_image']['name'];
$tmp_dir = $_FILES['user_image']['tmp_name'];
$imgSize = $_FILES['user_image']['size'];
if($imgFile)
{
$upload_dir = 'user_images/'; // upload directory
$imgExt = strtolower(pathinfo($imgFile,PATHINFO_EXTENSION)); // get image extension
$valid_extensions = array('jpeg', 'jpg', 'png', 'gif'); // valid extensions
$userpic = rand(1000,1000000).".".$imgExt;
if(in_array($imgExt, $valid_extensions))
{
if($imgSize < 1000000)
{
unlink($upload_dir.$edit_row['movil_Img']);
move_uploaded_file($tmp_dir,$upload_dir.$userpic);
}
else
{
$errMSG = "El archivo no puede superar 1MB";
}
}
else
{
$errMSG = "Solo archivos JPG, JPEG, PNG & GIF .";
}
}
else
{
// if no image selected the old image remain as it is.
$userpic = $edit_row['movil_Img']; // old image from database
}
// if no error occured, continue ....
if(!isset($errMSG))
{
$stmt = $DB_con->prepare('UPDATE tbl_movil
SET movil_Marca=:uname,
movil_Tipo=:ujob,
movil_Img=:upic
WHERE movil_ID=:uid');
$stmt->bindParam(':uname',$username);
$stmt->bindParam(':ujob',$userjob);
$stmt->bindParam(':upic',$userpic);
$stmt->bindParam(':uid',$id);
if($stmt->execute()){
?>
<script>
alert('Successfully Updated ...');
window.location.href='index.php';
</script>
<?php
}
else{
$errMSG = "Sorry Data Could Not Updated !";
}
}
}
?>
Dentro del div con la clase row se crea una galería de imágenes de 250 x 250 pixeles de la tabla tbl_movil. El código de la aplicación y de este archivo queda disponible para su descarga a traves de un aporte por PayPal. También dejo una demostración del código para revisarlo online , esto en los siguientes enlaces : DEMOSTRACION - IR A DESCARGAS
• Validación de formularios usando características de HTML5
• Método para insertar registros en MySQL usando PHP
• Obtener datos desde MySQL y mostrar el resultado en una tabla
• Los colores y sus códigos RGB
• Cómo evitar los comentarios spam
• Creando un login simple con jquery, php y mysql
• Conversor de Medidas Online
• Visualizar datos en una tabla parte II: Aplicando estilo css
• Un ejemplo de ABM usando Ajax - PHP - MySQL
• Usando jquery para modificar elementos del HTML
• Usar PDO para conectarse a MYSQL
• Cómo detectar el navegador usando JavaScript
• Cómo desarmar un notebook HP Compaq Presario C700
• Proyecto Intranet: Ordenes de servicio y ventas
• Michelles Jaque
• Beatriz Cabrera Zapata
• Mini Poesías - Constanza Gonzales
• Sobre las decisiones - Constanza Gonzales
• Enviar correos usando un formulario desde sitio web o localhost con PHPMailer
• Cómo crear un cuadro de búsqueda al estilo Google
• Sistema de LogIn con verificación de email y recuperación de contraseña usando PHP
• Demostración Jquery UI Selectable usando php y bases de datos mysql
• Subir, insertar, actualizar, borrar imágenes con PHP y MySQL
• Calculadora IMC usando JavaScript
• Select Dependientes con Ajax MySQL PHP
• Expresiones regulares en PHP
• Cómo convertir datos MySQL en formato JSON en PHP
• Visualizar datos en una tabla html con mysqli
• Siembras: Aplicación en Laravel 5.5