Function Load () Jquery loads me on the div but, not its jquery events

1

Good day, you have all come to you in search of a solution, as the title says when loading a load in another page the functions (Jquery) that previously established on the page stop working if that same page the charge in a Different tab works perfectly.  

this is the script where I send the information,

    $(document).ready(function() {

          $('.eliminarbt').click(function(e){
   var ideliminar = $(this).attr("id");
  $.ajax({
      method: "post",
      url: "carrito.php",
      data:{ideliminar:ideliminar},
      success:function(data){
          $('.tr'+ideliminar).html(data);
      }
  });


                $(this).closest('tr').remove().val('');       
        location.reload();

    });

    });

</script>

and this is the script where I get it from

<script>

    $(document).ready(function(){

   $('.btdeta').click(function(e){
            e.preventDefault();
           var iddetalles = $(this).attr("id");
       var detalles = "divdetalles";

            $.ajax({ 
                url: 'detallescarrito.php',
                method: 'POST',
                data: {iddetalles:iddetalles},
                success:function(deta){
                    $("."+iddetalles).html(deta);
                    $("."+iddetalles).css({"background":"rgba(0, 0, 0, 0.19)", "width":"50%"});
                }  
            }); 

      $('#'+detalles+iddetalles).toggle("slow", function(){
});

        }) ;


    });


    </script>

    <script>

    $(document).ready(function(){



    $('.btcar').click(function(e){
        e.preventDefault();
        var car = $(this).attr("id");

        var stop = $('#stock'+car).val();


        $.ajax({

            url:'carrito.php',
            method: 'POST',
            data:{car:car, stop:stop},
            dataType: "script",
            async:false,
            type:JSON,
            success:function(deta){

                $('#carrito').html(deta);
                $.getScript("js/probando.js") 
            }

        });

    });  

        $('#carrito').load("carrito.php");



        });

    </script>

and from here where I call the page

  

     

$ (document) .ready (function () {

     

$ ('. btcar'). click (function (e) {           e.preventDefault ();           var car = $ (this) .attr ("id");

   var stop = $('#stock'+car).val();
    $.ajax({

        url:'carrito.php',
        method: 'POST',
        data:{car:car, stop:stop},
        type:JSON,
        success:function(deta){

            $('#carrito').html(deta);
        }

    });

});  

    $('#carrito').load("carrito.php");



    });
  

if (isset ($ _ POST ['idupdate'])) {

  $idupdate= $_POST['idupdate'];
  $cantidad= $_POST['cantidad'];
  $shopCart[$idupdate]['cantidad']= $cantidad;

}

    // Proceso para eliminar productos

    if(isset($_POST['ideliminar'])){
        $ideliminar= $_POST['ideliminar'];
  $shopCart[$ideliminar] = NULL;


    }

    if(isset($shopCart)){

        $_SESSION['carrito'] = $shopCart;
    }

? >

            <table class="table">

                <thead>
                    <tr>
                       <th class="th"></th>
                        <th class="th">Imagen</th>
                        <th class="th">Nombre</th>
                        <th class="th">Precio</th>
                        <th class="th">Cantidad</th>
                        <th class="th">Subtotal</th>
                        <th></th>&nbsp;</tr>
                </thead>


                       <tbody class="boddy"  >
                        <?php 
     if(isset($shopCart)){
         $total = 0;
         for($i=0; $i<count($shopCart); $i++){

         if($shopCart[$i] != NULL){

      ?> 
                       <tr  >

                       <td>  <?php echo $shopCart[$i]['sucursal'] ?> </td>
                        <td><img src="img/productos/<?php echo $shopCart[$i]['imagen'] ?>" width="150" height="150"></td>
                        <td>
                            <?php echo $shopCart[$i]['nombre'] ?>
                        </td>
                        <td>
                            <?php echo number_format ( $shopCart[$i]['precio']); ?>
                        </td>
                        <td>

                            <form method="post" id="formstock">
                                <input type="hidden" value="<?php echo $shopCart[$i]['stock']; ?>">

                            </form>


                            <form method="post" id="formcantidad">
                                <input type="text" class="cant" id="canti" name="cantidad" min="1" maxlength="<?php echo $shopCart[$i]['stock']; ?>" value="<?php echo $shopCart[$i]['cantidad']; ?>" style="text-alaing: center;">
                                <br>
                            </form>



                        </td>

                        <!------------- aqui guardan los calculos de los precios--->
                        <td>
                            <?php 
         $subtotal = $shopCart[$i]['precio']*$shopCart[$i]['cantidad'];
             $total=$subtotal+$total;
             echo 'B.F'; echo number_format ($subtotal);

         ?>
                        </td>
                        <td >
                            <form id="frm<?php $i ?>">
                                <input type="hidden" name="ideliminar" value="<?php echo $i;?>">
                                <button type="button" class="eliminarbt" id="<?php echo $i;?>"> <span class="fa fa-times" value="Eliminar" src="#" style="color:red; cursor:pointer;"> </span> </button>
                           </form>
                        </td>
                    </tr>
                    <?php }}} ?>
                    <tr >
                        <td colspan="4"> &nbsp;


                        </td>

                        <td> <strong>Total </strong><br> B.F:
                            <?php echo @number_format ($total); ?> <br>

                            <form method="post" action="compra.php">
                                <input type="hidden" name="total" value="<?php echo @number_format ($total); ?>">
                                <button type="submit" class="btsiguiente" src="#" style="width: 135px; height:40px;" value="Comprar"> <span class="fa fa-check" style="color:green; cursor:pointer;"> Siguiente</span></button>

                            </form>


                        </td>


                    </tr>

                </tbody>



            </table>
            <br><br>
            <br>






            <?php
}else{

    echo '<script>

    alert("Debes Iniciar Sesion Para Poder Realizar Esta Transicción");
    window.location.href="valencia-tocuyito.html";

    </script>';

}

?>
    </article>



</body>




<!-- llama el Diseño del Menu -->
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="js/ajax.popper.min.js"></script>
<script src="js/jquery-2.2.4.min.js"></script>
<script src="js/bootstrap.min.js"></script>



<script>

    $(document).ready(function() {

          $('.eliminarbt').click(function(e){

              e.preventDefault();

   var ideliminar = $(this).attr("id");

              $(this).closest('tr').remove();

    sessionStorage.setItem("ideliminar", ideliminar);          

  $.ajax({
     method:"post",
     data:{ideliminar: ideliminar},  
  }).done(function(data){
   location.reload(data);
  });




    });

    });

</script>
    
asked by Steban De Abreu 08.08.2018 в 21:52
source

1 answer

0

I hope to be of your help.

First of all, you do not have a persistence layer of data, which when going from one route to the other the data is destroyed so I recommend you to see a bit of local storage which will help you to have your data persistent in the local browser, this means that if you go to another browser or clear the browser cache and go directly to route two this will not work since the data are persistent in that particular browser and the way to store them is in the browser cache.

Another way to make the data percistent is to have a backend with a data base connection, which is the most common in any web development, the previous example that I gave you of persistence is more limited but can be useful in case that you do not want to enter fully into the backEnd. Backend languages that you can use php python java C # javascript to name a few, data base mysql sqlite posgres to name one to work with them you will have to learn sql.

Here you can see how localStorage works, which is so you can test your development locally.

link

greetings

    
answered by 08.08.2018 в 23:05