Elimina elementos seleccionados de una tabla con PHP y MySQL

Eliminar elementos seleccionados de una tabla con PHP y MySQL

Vamos a eliminar elementos seleccionados de una tabla usando ajax, los datos estarán cargados en una base de datos MySQL.

Este ejemplo sirve para todo tipo de proyectos donde tenemos que eliminar varios items y eliminar de uno en uno es muy difícil.

Código

En el ejemplo tenemos básicamente 5 archivos.

• schema.sql: contiene la estructura de la base de datos, solo es una tabla
• index.php: es el archivo principal y contenedor.
• connect.php: contiene la conexión a la base de datos
• productos.php: aquí se muestran todos los productos (de este archivo hablaremos en detalle)
• eliminar_productos.php: obtiene los ids y elimina los productos

Vamos a hablar principalmente del archivo getproducts.php ya que contiene las piezas jquery y javascript que vamos a utilizar. El resto de codigo PHP es el mismo para la mayoría de cosas, como obtener los datos de la base de datos y mostrarlos.

A continuación previa del código en github.

<?php
	// Incluimos el archivo de conexion a la base de datos
	include "connect.php";
	// La siguiente es la consulta para obtener los productos de la BD
	$sql = "SELECT * FROM productos";
	// Nos conectamos a la BD
	$con = connect();
	// Ejecutamos la consulta SQL
	$query = $con->query($sql);
	// Hacemos un recorrido de los resultados y guardamos todo en la variable DATA
	$data = array();
	while($r = $query->fetch_object()){
	$data[] = $r;
	}
	?>
	<?php
	// Si los elementos de la variable data son > 0
	if(count($data)>0):?>
	<button id="selall">Seleccionar todo</button>
	<button id="delselected">Eliminar seleccionados</button>
	<br><br>
	<table border="1">
	<thead>
	<th></th>
	<th>Nombre</th>
	<th>Precio</th>
	</thead>
	<?php
	// Hacemos un reccorrido de la variable data
	foreach($data as $d):?>
	<tr>
	<td>
	<input type="checkbox" id="product-<?php echo $d->id; ?>" class="check">
	</td>
	<td><?php echo $d->nombre; // Nombre del producto ?></td>
	<td><?php echo $d->precio;// Precio del producto ?></td>
	</tr>
	<?php endforeach; ?>
	</table>
	<script type="text/javascript">
	$(document).ready(function(){
	$("#selall").click(function(){
	// Obtenenos los ids de todos los elementos
	checks = document.querySelectorAll(".check");
	if(checks.length>0){
	for(i=0;i<checks.length;i++){
	checks[i].checked=true;
	}
	}
	});
	$("#delselected").click(function(){
	// Obtenenos los ids de los elementos que esten seleccionados "checked"
	checks = document.querySelectorAll(".check:checked");
	// Verificamos que la cantidad de elementos seleccionados sea mayor a 0 (cero)
	if(checks.length>0){
	// Si hay elementos seleccionados
	// Le preguntamos al usuario si esta seguro de eliminar
	x = confirm("Estas seguro de eliminar "+checks.length+" elemento(s) ?");
	if(x){
	// Si el usuario esta seguro, procedemos
	// la variable ids contiene los IDs de los elementos seleccionados
	ids = "";
	// En el siguiente ciclo vamos a recorrer los elementos seleccionamos y guardaremos los // IDs separados por comas (,) en la variable ids
	for(i=0;i<checks.length;i++){
	// Los ids de los productos estan en los checkbox como "producto-ID" tenemos que hacer SPLIT // y después usar el elemento [1] que es el ID, el elemento [0] es "product"
	p = checks[i].id.split("-");
	// agregamos el ID a la variable ids
	ids += p[1] + ",";
	}
	// En la siguiente funcion AJAX vamos a enviar los IDS al archivo eliminar_producto.php
	$.get("eliminar_producto.php","ids="+ids,function(d){
	// Una vez finalizada la eliminacion procedemos a recargar los productos de nuevo.
	$.get("productos.php","",function(data){
	$("#products").html(data);
	});
	});
	}
	}else{
	// Si no hay elementos seleccionados
	alert("No hay productos seleccionados");
	}
	});
	});
	</script>
	<?php else:?>
	<p>No hay productos</p>
	<?php endif; ?>

Descargar

A continuación les dejo los archivos completos para descargar.

Link: Proyecto

Instalación

Para instalar el ejemplo deben hacer lo siguiente:

• Descargar y descomprimir los archivos
• Guardarlos en su carpeta “htdocs”
• Entrar a la base de datos desde PHPMyAdmin o desde la terminal y agregar el contenido del archivo schema.sql
• Entrar al ejemplo desde el navegador usando la carpeta donde la guardaron ejemplo http://localhost/eliminar_multiples_campos

Dudas y comentarios?