Tengo una lista generada dinámicamente a través del código php. Quiero eliminar filas haciendo clic. Mi código funciona bien solo la primera vez, la segunda vez

Html

                    <li>
                        <div class="pers-left-container">
                            <img src="<?php echo $cProduct['thumb']; ?>" />
                        </div>
                        <div class="pers-right-container">
                            <span class="sidebar-product-name"><?php echo $cProduct['name']; ?></span>
                            <a href="javascript:void(0);" class="close-container-product  removeItem">X

                            <form id="removeItemForm" method="post" >
                                <input type="hidden" value="<?php echo $cProduct['product_id']; ?>" name="removeProductId"  class="removePID" />
                            </form>
                            </a><br />
                            <label>Qty: </label><input type="number" value="1" min="0" max="100" step="5" /><br />
                            <span class="price-container-product">Amt: <?php echo $cProduct['price']; ?></span>
                        </div>
                        <div class="clearfix"></div>


                    </li>

Js

$( ".removeItem" ).each(function(index) {
                $(this).click("click",  function(){

                    //var otherInput = $(this).find('.pID').val();
                    removePID = {'removeProductId':$(this).find('.removePID').val()}
                    alert(removePID['removeProductId']);
                    $.ajax({
                        type:"post",
                        url:"index.php?route=common/personaliseyourflowers",
                        data:removePID,
                        success:function(response){
                            //alert(response);
                            if(response) {
                                $(".reloadCOnt").load(window.location + " .reloadCOnt");
                            }
                            //} else {
                                //$(".reloadCOnt").load(window.location + " .reloadCOnt");
                            //}
                        }
                    });
                });
            });

¿Alguien puede guiarme donde estoy equivocado? Lo haré, gracias

0
Ayaz Shah 10 dic. 2015 a las 13:26

3 respuestas

La mejor respuesta

.Haga clic dentro .cada uno? !! utilizar $('body').on('click' , selector , function(){});

$( 'body' ).on("click",".removeItem",  function(){

       //var otherInput = $(this).find('.pID').val();
       removePID = {'removeProductId':$(this).find('.removePID').val()}
       alert(removePID['removeProductId']);
       $.ajax({
       type:"post",
       url:"index.php?route=common/personaliseyourflowers",
       data:removePID,
       success:function(response){
                //alert(response);
                if(response) {
                  $(".reloadCOnt").load(window.location + " .reloadCOnt");
                 }
                 //} else {
                   //$(".reloadCOnt").load(window.location + " .reloadCOnt");
                 //}
               }
      });
});
1
Mohamed-Yousef 10 dic. 2015 a las 10:51

Use la función de clic y los eventos para evitar href:

$( ".removeItem" ).click(function(e) {
                   e.preventDefault(); // to stop redirecting to href 
                   //var otherInput = $(this).find('.pID').val();
                   removePID = {'removeProductId':$(this).find('.removePID').val()}
                   alert(removePID['removeProductId']);
                   $.ajax({
                        type:"post",
                        url:"index.php?route=common/personaliseyourflowers",
                        data:removePID,
                        success:function(response){
                            //alert(response);
                            if(response) {
                                $(".reloadCOnt").load(window.location + " .reloadCOnt");
                            }
                            //} else {
                                //$(".reloadCOnt").load(window.location + " .reloadCOnt");
                            //}
                        }
                    });
            });
0
Nehal 10 dic. 2015 a las 10:38

Piensa que hay un problema con la delegación de eventos,

Cambio

$(this).click("click",  function(){

Para

$(document).on("click", ".removeItem", function(){
0
Niranjan N Raju 10 dic. 2015 a las 10:32
34199391