buen día.
Estoy tratando de hacer una pagina de ventas donde en el index.php
se muestran todos los productos y al hacer click
a cualquier producto aparece una ventada modal mostrando información especifica de dicho producto de esta manera:
La cosa es que de la manera en que lo estoy haciendo, necesito pasar la id
del producto por la URL cada vez que el usuario de click
en el nombre del producto de esta manera:
<?php foreach($productos as $producto):?>
<section>
<div class="div-image-product">
<img src=<?php echo $producto['imagen']?> alt="">
</div>
<div class="div-tittle-product">
<a href="index.php?id=<?php echo $producto['id']; echo'&p='.pagina_actual();?>" class="abrir-vista-producto"><p><?php echo $producto['nombre']?></p></a>
</div>
<div class="div-price-product">
<label><input type="checkbox" id="chbx_añadir_carrito">Añadir</label>
<p><?php echo '$'.$producto['precio']?></p>
</div>
</section>
<?php endforeach;?>
Donde paso el id
de cada producto por $GET
es el <a>
del div
con la clase "div-tittle-product"
.
Mi problema esta en que cada vez que hago click
en algún producto no se pasan las variables por la URL, y la ventana modal aparece y desaparece por si misma en fracciones de segundo, debido a que se recarga la pagina al pulsar el enlace.
Este es mi código JQuery
:
$(document).ready(function() {
$(".abrir-vista-producto").on("click", function(e) {
$(".modalDialog").addClass("active");
//e.preventDefault();
});
$(".close").on("click", function() {
$(".modalDialog").removeClass("active");
});
});
La única manera en que no desaparece la ventana modal, es des-comentando la linea 4 del código JQuery
, y de esta manera si me aparecen las variables $GET
en la URL. Pero al hacer esto da igual que producto seleccione, siempre me muestra el ultimo producto de la pagina en la ventana modal.
Mi pregunta es como hago para que aparezca la información especifica de cada producto que seleccione en la ventana modal. Tengo entendido que Ajax sirve para hacer peticiones sin recargar la pagina, pero la verdad soy muy nuevo en esto del desarrollo web y no tengo idea de como hacerlo. Espero y me puedan ayudar, gracias.