Oh no! Where's the JavaScript?
Your Web browser does not have JavaScript enabled or does not support JavaScript. Please enable JavaScript on your Web browser to properly view this Web site, or upgrade to a Web browser that does support JavaScript.
Sign In
Not a member yet? Click here to register.

Need assistance: Ajax Success inner function callback Firing multiple times.

This is the ajax call used to populate the cart item.

CodeDownload  

// add action
       $('#add_cart').bind('click', function() {
      var sendData = $('#productfrm').serialize();
      $.ajax({
         url: '".INFUSIONS."eshop_cart_panel/cart.ajax.php',
         type: 'POST',
         dataType: 'html',
         data : sendData,
         success: function(result){
            $('#cart').addClass('open');
            $('#cart-list').append(result);
            deleteItem(); // executed like.. 3 times on the third delete.
            new PNotify({
            title: 'Item Added',
            text: 'You have added item to your cart.',
            icon : 'notify_icon n-gift',
            animation: 'fade',
            width: 'auto',
            delay: '2500',
            });
         },
         error: function(result) {
            new PNotify({
               title: 'Error File',
               text: 'There are error in processing your request. Please contact the Site Admin.',
               icon: 'notify_icon n-attention',
               animation: 'fade',
               width: 'auto',
               delay: '3000'
            });
         }
      });
      });
      deleteItem();
      ");



And the function for deleteItem is.

CodeDownload  

function deleteItem() {
         $('.remove-cart-item').bind('click', function(e) {
            var Data = {
            'usr': '".defender::set_sessionUserID()."',
            'val' : $(this).data('value'),
            'clr' : $(this).data('color'),
            'prid' : $(this).data('product'),
            'cdyn' : $(this).data('cdyn'),
            'time' : $(this).data('added')
            };
            var sendData = $.param(Data);
            $.ajax({
               url: '".INFUSIONS."eshop_cart_panel/cart_remove.ajax.php',
               type: 'POST',
               dataType: 'json',
               data : sendData,
               success: function(result){
                  $('#cart').addClass('open');
                  if (result.response == 1) {
                     $('#product-'+Data['prid']+'-'+Data['cdyn']+'-'+Data['clr']+'-'+Data['time']).remove();
                     new PNotify({
                     title: 'Item Removed',
                     text: 'You have removed item to your cart.',
                     icon : 'notify_icon n-gift',
                     animation: 'fade',
                     width: 'auto',
                     delay: '2500',
                     });
                  } else {
                     console.log(result.data);
                     new PNotify({
                     title: 'Product Cannot be Removed (Code 2)',
                     text: 'There are error in processing your request. Please contact the Site Admin.',
                     icon: 'notify_icon n-attention',
                     animation: 'fade',
                     width: 'auto',
                     delay: '3000'
                  });
                  }

               },
               error: function(result) {
                  new PNotify({
                     title: 'Error File',
                     text: 'There are error in processing your request. Please contact the Site Admin.',
                     icon: 'notify_icon n-attention',
                     animation: 'fade',
                     width: 'auto',
                     delay: '3000'
                  });
               }
               });
            });
         }



On Success I need to bind a new event on the item added, else the added item will not have a remove.

Currently the problem is the deleteItem on success fires 1 time for first remove click, fire 2 times for second remove click, fire 3 times for third remove click.

How do I solve this so it will only fire once?

Any help appreciated.
I got the solution via this:

CodeDownload  

$.ajax({
         url: '".INFUSIONS."eshop_cart_panel/cart.ajax.php',
         type: 'POST',
         dataType: 'json',
         data : sendData,
         success: function(result){
            $('#cart').addClass('open');
            $('.cart-blank').remove();
            $('#cart-list').append(result.html);
            $(result.remove).remove();
            $('#subtotal_price').text(parseFloat(result.subtotal));
            deleteItem(result.tid);
            new PNotify({
            title: result.title,
            text: result.message,
            icon : 'notify_icon n-gift',
            animation: 'fade',
            width: 'auto',
            delay: '2500',
            });
         },
         error: function(result) {
            new PNotify({
               title: 'Error File',
               text: 'There are error in processing your request. Please contact the Site Admin.',
               icon: 'notify_icon n-attention',
               animation: 'fade',
               width: 'auto',
               delay: '3000'
            });
         }
      });



CodeDownload  
Object { 
remove: "", tid: 87, html: "<li id='product-17-1-2-1423195272'>
<div class='pull-left m-r-10'>
<img class='img-responsive' src='./eshop/pictures/cover2_a190cac1-9d68-4552-8883-2b068adbea51_large.jpg' />
</div>
<div class='overflow-hide'>
<button id='remove-87' title='Delete' data-product='17' data-cdyn='1' data-color='2' data-added='1423195272' data-value='87' type='button' class='remove-cart-item pull-right'><i class='fa fa-remove'></i></button>
<a class='display-block product-title' href='./../../eshop.php?product=17'>Pantone Shampoo Gold</a><div class='display-block text-smaller'><span id='qty'>1</span> x USD <span id='unit-price'>15.99</span></div>
</div>
</li>
", subtotal: "15.99", error_id: 0, title: "Product Updated", message: "Your cart have been successfully updated."
}



Thanks.
:G
Thread Information
Author
Replies
3 posts
Views
438 times
Last Post
Last updated on 5 years ago
You can view all discussion threads in this forum.
You can start a new discussion thread in this forum.
You cannot reply in this discussion thread.
You cannot start on a poll in this forum.
You cannot upload attachments in this forum.
You cannot download attachments in this forum.