Archivo: "pruebaJson.php"
<?php
include "includes/header.php";
include 'includes/conexion.php';
?>
<!--Éstos dos span muestran los datos que recibo a través de AJAX y JSON. Éstos datos son la imagen y el ID-->
<span id="respuesta1"></span>
<span id="respuesta2"></span>
<!--slider-->
<!--Aquí estoy mostrando todas las imágenes guardadas en mi BBDD-->
<?php
$instruccion1="SELECT * FROM producto";
$consulta1=mysqli_query($conexion, $instruccion1);
?>
<div class="slider-container">
<div class="slider">
<?php
while($filas1=mysqli_fetch_array($consulta1)){
echo '<img src="img/'.$filas1['imagen'].'" onClick="enviarDatos(event)">';
//Cuando hago click sobre cualquiera de las imágenes pongo en marcha la función
//enviarDatos(). Énvío a su vez la ruta de la imagen sobre la que estoy pulsando
}
?>
</div>
<script>
function enviarDatos(event){
//Recojo la ruta de la imagen
var imagen=event.target.src;
//hago un split para sacar el nombre de la imagen de la ruta
var imagen = imagen.split("/");
imagen=imagen[imagen.length-1];
$.ajax({
data:{
imagen:imagen, //envío a través de json el nombre de la imagen al archivo "listar.php", del cuál pretendo recibir el nombre de la imagen (de nuevo, ya que el objetivo es mostrar esta info en una ventana modal) y su ID
},
type:"GET",
datatype:"json",
url:"listar.php"
})
.done(function(datos,textStatus,jqXHR){
respuesta1.innerHTML="<img src='img/"+datos.imagen+"'>"; //datos que recibo de "listar.php"
respuesta2.innerHTML="ID:"+datos.id;
})
}
</script>
</div>
</div>
</body>
</html>
Archivo: "listar.php"
<?php
//Incluyo la conexion
include 'includes/conexion.php';
if ($conexion->connect_errno) {
echo "Falló la conexión: %s\n", $conexion->connect_error);
exit(); }
//Recojo y guardo el nombre de la imagen que envío a través de AJAX
$imagen=$_GET['imagen'];
//Hago una consulta a mi bbdd para obtener el ID de esa imagen
$instruccion="SELECT * FROM producto WHERE nombre='".$imagen."'";
$consulta=mysqli_query($conexion, $instruccion);
$fila=mysqli_fetch_row($consulta);
//Guardo los datos en el array datosJson, para devolverlos
$datosJson['imagen']=$imagen; //Guardo nombre de la imagen
$datosJson['id']=$fila[0]; //Guardo ID de la imagen obtenido a través de la consulta
header('Content-type: application/json; charset=utf-8');
echo json_encode($datosJson);
exit();
?>
Desde "pruebaJson.php" envío a través de Ajax (función enviarDatos(event)) el nombre de la imagen sobre la que estoy pulsando al archivo "listar.php". En listar.php, hago una consulta a mi bbdd para obtener el id de esa imagen y enviar esa información a "pruebaJson.php", dónde muestro el id y la imagen pulsada en una ventana modal.
if ($conexion->connect_errno) { printf("Falló la conexión: %s\n", $conexion->connect_error); exit(); }
Esto es sólo para depurar. Si tu código espera una respuesta JSON, lo mejor sería ir controlando el código y al final dar una respuesta en ese formato siempre, sea con los datos erróneos, sea con los datos correctos.if ($conexion->connect_errno) { printf("Falló la conexión: %s\n", $conexion->connect_error); exit(); }
. El hecho de que un código funcione en un sitio no implica que tenga que funcionar en otro. Puede haber un error de ruta en el archivo que incluyes, pueden ocurrir miles de eventualidades que no controlas. Uno de los peores errores en programación es presuponer que las cosas van a ir bien. Cuando programas tienes que ser pesimista, o sea, pensar que puede salir mal y controlar los errores.listar.php
?