How to get one time alert inside JQuery post method within loop?

Question

I have 4 items data to post and get the response data 4 time because i post the data inside the loop. after that i also get alert 4 time but i want to show one time alert after 4 data post.

<script>

 $('#save').on('click',function(){   
  var i =1;
  //i have 4 item 
  $('.item').each(function() {  
   
   $.post( "example.php", { id: i })
   .done(function( data ) {
       
    alert(0); // just one time
    
       
   });

   i++; 
  });
   

        })
</script>

Hope this helps - https://stackoverflow.com/questions/17904704/jquery-ajax-solution-inside-each-loop. Use `when` as @XiaodanMao suggested. — Phani Kumar M, Nov 03 '17 at 06:10

Amol · Answer 1 · 2017-11-03T06:08:17.157

1

Try similar code

<script>

$('#save').on('click',function(){   
    var i =1;
            var cnt=0;
    //i have 4 item 
    $('.item').each(function() {        

        $.post( "example.php", { id: i })
        .done(function( data ) {
            cnt++;
                    if (cnt==4) {
                        alert(0); //for one time after all items post.  
                    }

        });

        i++;    
    });


       })
</script>

Hope this will help you!.

edited Nov 03 '17 at 06:08

answered Nov 03 '17 at 06:02

Amol

429
4
22

if post data are fail it also alert. i just need to alert one time after the response inside done function. Thanks – Min Ko Ko Nov 03 '17 at 06:04

score 0 · Answer 2 · answered Nov 03 '17 at 06:17

you can try by setting the counter like given below.

$('#save').on('click',function(){   
    var i =1;
    var counter = $('.item').length -1;
    //i have 4 item 
    $('.item').each(function() {        
        $.post( "example.php", { id: i })
        .done(function( data ) {
              if(counter == 0)
                   alert(0); //for one time after all items post.            
           counter = counter ==0 ? 0: counter -1;
        });
        i++;    
    });
});

I think @Amol had updated the answer before me and his answer is almost same as mine so if it is correct Accept his ans first :) — Makarand Patil, Nov 03 '17 at 06:20

score 0 · Answer 3 · answered Nov 06 '17 at 03:06

By using jQuery.when() and deferred.resolve at jQuery.ajax complete event

you could gather all requests and see which one succeed and which one failed.

Try running the code below, but please note there are no example.php on stackoverflow, so you'll see all 4 requests failed.

jQuery(function($) {

  // make all requests
  var requests = $('.item').map(function(idx, elm) {
    var deferred = $.Deferred();

    $.ajax({
      method: 'post',
      url: 'example.php',
      data: { id: idx + 1 },
      complete: deferred.resolve
    });

    return deferred;
  });

  // when all requests are done.
  $.when.apply($, requests).done(function() {

    var stats = { success: 0, error: 0 };

    // count how many of them succeed or failed.
    for (var i = 0; i < arguments.length; i++) {
      stats[arguments[i][1]]++;
    }

    // print resullt.
    console.log(
      arguments.length + ' Requests completed, ' +
      stats.success + ' Succeeded, ' +
      stats.error + ' Failed.'
    );

  });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button id="save">Save</button>

<div class="item">Item 1</div>
<div class="item">Item 2</div>
<div class="item">Item 3</div>
<div class="item">Item 4</div>

How to get one time alert inside JQuery post method within loop?

3 Answers3