Yo intentando aprender un poco mas, hace unos meses a modo de aprendizaje desarrollé un carrito de compras muy básico, todo en PHP. Por limitaciones varias cada vez que cambio de pantalla vuelvo a recargar algunas secciones que no varían como ser encabezados y pie, lo cual me parece que no es la forma. Investigando JQuery encontré la funcion load y POST, pero no me funcionaron como imaginaba.
- Estoy en una pagina llamada detalle.php, aqui visualizo 1 artículo que preseleccioné y puedo ver sus características antes de cargarlo al carrito. El form es el siguiente :
<div id="detalle_titulo">
<h3><?php echo $nombre?></h3>
</div>
<div id="detalle_foto">
<img src="<?php echo $imagen?>" width="180px" height="180px">
</div>
<div id="detalle_precio">
<p><strong>Precio :</strong> $
<?php echo $precio?>
</p>
</div>
<div id="detalle_stock">
<p><strong>Stock :</strong>
<?php echo $stock?>
</p>
</div>
<div id="detalle_desc">
<p><strong>Descripción :</strong>
<?php echo $desc?>
</p>
</div>
<form action="carrito.php" method="post" name="compra">
<input name="id_txt" type="hidden" value="<?php echo $id?>" />
<input name="nombre" type="hidden" value="<?php echo $nombre?>" />
<input name="precio" type="hidden" value="<?php echo $precio?>" />
<input name="cantidad" type="hidden" value="1" />
<input name="stock" type="hidden" value="<?php echo $stock?>" />
<?php if ($stock>0) { ?>
<div id="detalle_caja_botones">
<input class="boton_detalle" name="cancelar" type="submit" value="Cancelar" />
<input class="boton_detalle" id="bbb" name="Comprar" type="submit" value="Comprar" />
</div>
<?php }else{ echo "Producto temporalmente agotado"; ?>
<input class="boton_detalle" name="Cancelar" type="submit" value="Cancelar" />
<?php } ?>
Cuando le doy click al botón que a modo de prueba le puse id="bbb" llamo a carrito.php y le paso por POST 5 valores, que luego tomo en carrito.php para agregarlos y mostrar una tabla con el pedido actualizado. De este modo, estoy recargando la web completa con todas sus secciones lo cual me gustaría evitar, ya que solo necesito mostrar una tabla y que todo lo demas quede como está. Para no perder el hilo, refresco que estoy en detalle.php y llamo a carrito.php pasandole 5 valores por POST. Quise probar cargando carrito.php como un HTML externo; En la cabecera de detalle.php agregué la libreria JQuery y lo siguiente:
< script type = "text/javascript" >
$(document).ready(function() {
$('#bbb').click(function(evento) {
//evento.preventDefault();
$(".productos").load('carrito.php');
});
});
< /script>
===================================================
.productos es el div donde quiero mostrar la tabla, primero me ocurrió que me recargaba carrito.php completa, luego probé con evento.preventDefault(); pero el problema es que no envía los 5 valores por POST.
¿Alguna sugerencia de como lograr lo que necesito? Gracias adelantadas !!!