strategy to split up php output into smaller outputs (ajax, php) (nested ajax calls, ajax within ajax?)

Question

Hi,

I don't know the correct terminology to search for the solution. Please suggest a strategy to break up the php output into small chunks and pass them stepwise to ajax's responseText.

The project is an ajax webpage that takes a text string (lastname) and passes it to a php program. The php code takes the last name and randomly fetches 3 people with different first names, and puts it into an array. Once that is done, the php code will contact outside servers to retrieve info associated with each name, and output the info to a div of the webpage. The process of getting data from the outside servers is very slow.

This code is basically done, but the whole process takes a very long time to generate the output on the screen. Is there a way (a strategy) to output each step of the php code immediately instead of having to wait for the complete code?

My pseudo php code is like this:

<?

get 3 names; //output this immediately

foreach name { get phone number } 

?>

Alternatively, I could get a name and the phone#, and output it immediately before moving to the next name.

Are there php or ajax codes/functions/strategies that would achieve this? Please suggest solutions or search keywords.

Addition/Edit:

Thanks for the suggestions. Is it possible to execute another ajax call after the parent ajax call? I initially went that route, but my testing of nested js/ajax call did not work. It could be due to syntax errors, please look over the code.

The test code in the testajax.php (or testajax.html) file for the ajax call XHR.responseText is

<div id="name" >JAM  <div id="numa" > 
<br />
<br />text holder >>

<script type="text/javascript">
var pid=document.getElementById("numa").parentNode.id;

alert (pid);

document.getElementById('numa').innerHTML += 'append text>> ';

document.write(' docwrite');    
</script> 

</div>  
</div>
<br />
<br />ending text

If I view the file testajax.php (or testajax.html) directly, I would see

JAM


text holder >> (an alert window) append text>> docwrite


ending text

but if I do an ajax call of the testajax.php file, all I would see is

JAM


text holder >> 


ending text

The code inside the <script> </script> tags does not run after the ajax call

can someone explain this, and offer a fix?

TIA

Answer 1

Without knowing the actual code and code-based answer is hard. But, here's an idea.

When you get the three names, return them to the page and display them. Then, for each one, in a different AJAX call, call the phone info. I'm not positive if javascript will make all three calls independently of each other, but that would at least display all 3 names, and then each phone info one at a time.

---

Edit

Workflow:

• Javascript sends a name to php via ajax.
• PHP returns 3 names to js
• js appends 3 divs to the page, one with each name.
• js makes 3 requests to php, sending 1 name per request.
• php returns phone info / whatever else to js
• js takes info and adds it to the respective div

Answer 2

In theory, yeah, you can call flush() (and ob_flush() as necessary) to ensure output is sent from PHP.

However, the web server may add buffering of its own outside of the scope of PHP (most commonly, if mod_deflate is in use on Apache); and you'd have to be careful about delimiting your response chunks so they're not read by the browser until a chunk is complete.

In any case not all browsers can read the responseText from an XMLHttpRequest until the request is fully complete. So for it to work on all clients, you'd have to try a different mechanism, such as the old-school HTML-iframe-containing-multiple-<script>s.

Summary: it's a bunch of hassle, and perhaps not really worth it. A simpler-to-deploy possibility would be separate AJAX requests for each name.