1

estuve haciendo un carrito de compras en donde cree una sección en la que podes cambiar la cantidad de los productos elegidos, al principio lo habia hecho con un form normal, pero despues me decidí a hacerlo con ajax, asi el usuario no tiene la necesidad de esperar a que el formulario se recargué, el problema es que el ajax solo funciona la primera vez, ya a la segunda se ejecuta el formulario normal sin el ajax, el código del ajax es este:

    <script>
$('.actform').on('submit', function(ev) {   
  var id2 = $(this);   
  $.ajax({
    type: $(id2).attr('method'),
    url: $(id2).attr('action'),
    data: $(id2).serialize(),
    success: function(data) {            
    $('.container').load(' .container');
    },
    error: function() {
    alert('Ha ocurrido un error');
    }
  });
  ev.preventDefault();
});
</script>

el problema de que a la seguna vez el formulario se ejecute el ajax lo soluciones simplemente cambiando el $('.container').load( '.container'); por $('.container').load(window.location.reload(false));. Y queria saber si existe alguna otra forma de hacer esto porque al usar el window.location.reload(false) la pagina se reinicia pero queda muy forzado el reinicio.

El código del carrito es este por si lo necesitan ver:

  <main id="main" class="main">
    <?php if(!empty($_SESSION['cart'])){ ?>  
        <div class="container">
          <h2 class="carrito-title">Mi Carrito</h2>
          <div class="container2">
            <div class="container-cart">
              <table>
                <thead>
                  <tr>
                    <th class="product-image">Imagen</th>
                    <th class="product-name">Producto</th>
                    <th class="product-price">Precio</th>
                    <th class="product-quantity">Cantidad (Modificar)</th>
                    <th class="product-total">Total</th>
                    <th class="product-remove">Eliminar</th>
                  </tr>
                </thead>
                <tbody>
                  <?php
                    $total= 0;
                    foreach($_SESSION['cart'] as $indice=>$producto){
                      $ID = $producto['ID'];                    
                       $select_products = $connect->prepare("SELECT * FROM `productos` WHERE id=$ID") or die('query failed');
                            $select_products->execute();
                            $list_products = $select_products->fetchAll(PDO::FETCH_ASSOC);
                            foreach($list_products as $product){
                              $nombre= $product['nombre'];
                              $precio= $product['precio'];
                              $codigo = $product['codigo'];
                              $imagen = "media/productos/$codigo.png";
                            ?>
                  <tr>
                    <td class="product-image">
                      <img src="<?php echo $imagen?>" alt="<?php $nombre?>">
                    </td>
                    <td class="product-name">
                      <h2 class="name"><?php echo $nombre?></h2>
                    </td>
                    <td class="product-price"><h2 class="precio">$<?php echo number_format($precio, 0, ',', '.')  ; ?></h2></td>
                    <td class="product-quantity">
                        <form action="backend/actProduct.php"  method="post" class="actform" id="<?php echo $ID ?>">
                          <div class="cantidad">
                            <div class="cantidad-container">
                            <input type="hidden" name="id" min="1" value="<?php echo openssl_encrypt($ID,COD,KEY);?>">
                              <input type="number" class="nro updateCant" onchange="btnCart.click()" name="cantidadupd" value="<?php echo $producto['CANTIDAD'];?>">
                              <button name="btnCart" value="Update" type="submit" class="actualizar"><i class="fa-solid fa-rotate"></i></button>
                            </div>
                          </div>
                        </form>
                    </td>
                    <?php
                    $sub_total = $precio * $producto['CANTIDAD'];
                      $total = $total + $sub_total;
                    ?>
                      <td><h2 class="subtotal">$<?php echo number_format($sub_total, 0, ',', '.'); ?></h2></td>   
                    <td>
                      <form action="backend/deleteProduct.php" method="post">
                        <input type="hidden" name="id" value="<?php echo openssl_encrypt($ID,COD,KEY);?>">
                        <button class="delete" name="btnCart" type="submit" value="Remove" onclick="return confirm('Seguro que quieres eliminar este artículo?');">X</button>
                      </form>
                    </td>                                        
                  </tr>
            
                <?php
                    }};           
                ?>
            </tbody>
            </table>
          </div>
            <?php if(isset($_SESSION['cart'])){ ?>
              
              <div class="nocart">
                <div class="final">
                  <h5 class="final-price preciofinal">Precio sin Impuestos: $<?php echo number_format($total, 0, ',', '.');?></h5>
                  <form action="backend/emptyCart.php" method="post" class="emptyform" id="<?php echo $ID ?>">
                    <input type="hidden" name="empty">
                    <button name="btnCart" type="submit"  class ="vaciar" value="Empty" onclick="return confirm('¿Desea vaciar el carrito?');">Vaciar carrito</button>
                  </form>
                </div>
                <?php
                  if ($rol=='representante'){
                ?>
                  <div class="checkout">
                    <form action="productos.php">
                      <button name="btnFinCart" class="seguircomprando-btn">Seguir comprando</button>
                    </form>
                    <a class="checkout-btn" href="clientes.php">Seleccionar cliente</a>
                  </div>
                
                <?php
                }else{?>
                  <div class="checkout">
                    <form action="productos.php">
                      <button name="btnFinCart" class="seguircomprando-btn">Seguir comprando</button>
                    </form>
                    <form action="backend/fincompra.php" method="post" onsubmit="showLoad()">
                    <button name="btnFinCart" class ="checkout-btn" onclick="return confirm('¿Está seguro que desea finalizar la compra?');" value="Fin" >Finalizar compra</button>
                    </form>
                  </div>
                <?php
                }
                ?>
              </div>
            </div>
            <?php }?>
        </div>
        <?php }else{
                echo '
                <div class="nosesion">
                  <h2 class="cartvacio">El carrito esta vacío</h2> 
                  <a class="comprar-btn" href="productos.php">Comprar ahora</a>
                </div>
                ';
                
            }?>
  </main>

actProduct.php :

<?php
if(!isset($_SESSION)) { 
    session_start(); 
};
include 'connect.php';
include 'config.php';
if (isset($_POST['id'])) {
    if(is_numeric(openssl_decrypt( $_POST['id'], COD, KEY))){
        $ID=openssl_decrypt($_POST['id'],COD,KEY);
        foreach($_SESSION['cart'] as $indice=>$producto){
            if($producto['ID']==$ID){
                if($_POST['cantidadupd']<1){
                    $_SESSION['cart'][$indice]['CANTIDAD']= 1;
                }else{
                    $_SESSION['cart'][$indice]['CANTIDAD'] = $_POST['cantidadupd'];
                }
            }
        }
    }
    header('location: ../cart.php');
}else{
    echo '<script>alert("Ha ocurrido un error"); window.location = "../cart.php";</script>';
    exit;
}
7
  • Tienes doble punto y come en la línea de $('.container').load(' .container');; y la consola te arroja algún error?
    – hejevero
    Commented el 1 jul. 2022 a las 4:08
  • Qué significa $('.container').load('.container')? A .load() tenés que pasarle una URL no un selector. Qué es lo que estás queriendo hacer concretamente? Entiendo que hacés una consulta a través de AJAX, pero qué querés hacer con la respuesta? Qué es concretamente lo que te devuelve esa consulta?
    – azeós
    Commented el 1 jul. 2022 a las 4:08
  • la doble ;; lo agregue sin querer en la pagina, pero en mi codigo esta bien, la consola no me arroja ningun error, y lo que quiero lograr con $('.container').load(' .container') es que actualice todo el container, asi cuando alguien cambie la cantidad del producto, el precio y la cantidad se actualicen también. Commented el 1 jul. 2022 a las 4:12
  • Pero qué es lo que devuelve el llamado a "actProduct.php"? Un HTML?
    – azeós
    Commented el 1 jul. 2022 a las 4:14
  • es en donde se actualiza la cantidad, ahi lo agregué al post principal Commented el 1 jul. 2022 a las 4:19

0

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

Examina otras preguntas con la etiqueta o formula tu propia pregunta.