estoy desarrollando un proyecto de un sitio web de unos platillos, estoy usando html, csss y javascript, aparte de eso uso tambien PHP, quisiera saber como puedo hacer para que cuando el usuario le de en "Más detalles" sin importar que tarjeta sea muestre informacion de dicha tarjeta, el codigo que tengo de la modal y como llamo los datos de la base de datos es este:
<div class="ContainerCards">
<?php $resultado = mysqli_query($conexion, $platillos);
while($row=mysqli_fetch_assoc($resultado)) { ?>
<div class="card" style="width: 18rem;">
<img src="data:image/jpg/png/jpeg;base64,<?php echo base64_encode($row['Foto_Platillo']); ?>">
<div class="card-body">
<h5 class="card-title"><?php echo $row["Nombre_Platillo"] ?></h5>
<p class="card-text">$<?php echo $row["Precio_Platillo"] ?></p>
<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModal">
Más Detalles
</button>
</div>
<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">
<?php echo $row["Nombre_Platillo"] ?>
</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<?php echo $row["Descripcion_Platillo"] ?>
</div>
<div class="modal-body">
<?php echo $row["Precio_Platillo"] ?>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Salir</button>
</div>
</div>
</div>
</div>
</div>
<?php } ?>
</div>
La consulta que le hago a la base de datos:
include("conexion.php"); $platillos = "SELECT * FROM platillos";
ahora bien cuando yo le doy a cualquier tarjeta solo me muestra la informacion de la primera, como podria hacer que al darle en "más detalles" me muestre la informacion no solo de la primera si no del resto sin importar en cual tarjeta le de al boton de "más detalles".
Agradeceria un monton la ayuda.