I’m trying to send multiple post within a do while loop but the result is not added
<script type="text/javascript">
function action() {
var initval = 1;
var endval = 5;
do {
var action_string = 'txtuser=someone';
$.ajax({
type: "POST",
url: "http://localhost/js.php",
data: action_string,
success: function(result){
$('div#append_result').append(initval + ',<br/>');
}
});
initval++;
} while (initval <= endval);
}
</script>
The Output is:
5,
5,
5,
5,
5,
and I need the output to be:
1,
2,
3,
4,
5,
Due to the async nature of AJAX, by the time your success function runs for any of the resulting AJAX requests, the loop has completed and
initvalis set to 5. You need to capture the state ofinitvalat the start of each request and use that captured state in thesuccess()method. Closing over the value is the simplest way to do it:Understand, though, that one or more requests could get hung up at the server allowing a latter request to complete first, which could result in
1, 2, 5, 3, 4or something like that.Also, using an element’s ID is much faster than prefixing the hash selector with the elements tag name. Plus you should avoid re-querying the DOM for your result DIV every time the success runs. Grab it once and use it when needed: