Show each result one at a time

Question

I have code that increments the URL parameter in a while until $i is equal to 10. When this happens, it will display every number up to 10 (since this is when $i stops increasing) - in this case it will be 1 , 2, 3, 4, 5, 6, 7, 8, 9.

The problem is that only when $i is 10, it shows 1, 2, 3, 4, 5, 6, 7, 8, 9 - I need to display the numbers as it happens (instead of expecting $i to be 10!) .

 <div id="here"></div> <script> $(document).ready(function(){ $.ajax({ type: "POST", url: "test2.php", success: function(data) { $("#here").html(data); } }); }); </script> 

test2.php:

 while($content = file_get_contents('https://www.example.com?id='.$i)) { if($i !== 10) { echo $i; }else{ break; } $i++; } 

Answer 1

You can also request each file in sequential order with .queue() , .append()

 var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]; $({}).queue("ajax", $.map(arr, function(item, i) { return function(next) { return $.ajax({ type: "POST", url: "test2.php", data: {n:item} }) .then(function(data) { $("#here").append(data); next(); }); } })).dequeue("ajax") 

Php

 if (isset($_POST["n"])) { $content = file_get_contents("https://www.example.com?id=" . $_POST["n"]); echo $content } 

Answer 2

There is no stable way to generate PHP script output until the end of the script.

If you need a countdown, you can put a while loop in your Javascript and call its PHP script with something like:

 test2.php?i=1 

then

 test2.php?i=2 

and etc.

Answer 3

I really think async will help you here. Could you try this code?

 <script> $(document).ready(function(){ $.ajax({ type: "POST", url: "test2.php", async: false, success: function(data) { $("#here").html(data); } }); }); </script>