PHP For Loop - Updating a span for each record processed in loop

Prior to my loop, I have the following header encapsulating a span which outputs the variable $count (set to 0 to begin with):

$count = 0;
echo '<h4>Compiled Data (<span class="changeNumber">', $count, '</span> Records):</h4>';

Open in new window

Within my loop I am incrementing the value of $count by one:


Open in new window

That's all fine and good, but I don't know how to update the span without using JavaScript for each iteration of the loop.  I can make it happen all day in ColdFusion and/or JavaScript.  There has to be an equivalent PHP solution.  I'm all ears!  How do I update the span with the incremented value of $count using only PHP?
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Ray PaseurCommented:
PHP variables  can be substituted into HTML strings, but you have to either use string concatenation or use the double quotes.

Please see:
<?php // demo/temp_brianmfalls.php

echo '<pre>';

$count = 0;
while ($count < 5)
    echo '<h4>Compiled Data (<span class="changeNumber">' . $count . '</span> Records):</h4>';

Open in new window

If you're new to PHP and want some good learning resources, this article can help.  Just skip over the elementary parts :-)
NerdsOfTechTechnology ScientistCommented:
PHP is server-side. Once you output the variable you'll need to use client-side scripting to modify that original output.

Why not wait until you finish the count before outputing the first time?
brianmfallsAuthor Commented:
I thought that might be the case.  How then, do I integrate a script in with the php that will update the count on the client side as the server side processes?  I started out by outputting the total count.  That is simple.  :)

The purpose of updating the count is to entertain the end user.  If they see that the page is working, they are less likely to do something stupid, like refreshing the screen while the data is still being processed.  My end goal is to display the total, and to display a reverse counter that will count down from the total records being processed to 0.   The average records being processed are between 1700 and 1800.  As you would expect, that takes quite some time.  While there is a loading modal in place during processing, the user may be inclined to think that the process is stuck.  The counter would assure them that the process is running, and not stuck.

So...  Via my current, and somewhat educated but ignorant, understanding of PHP, I expected that this script (jQuery) would happily update our counter:

 echo "<script>$('.changeNumber').html('$count')</script>";

Open in new window

Clearly, it doesn't.  How can I make it work?

Ray, I'm off to read your article right now.  :)
Learn Ruby Fundamentals

This course will introduce you to Ruby, as well as teach you about classes, methods, variables, data structures, loops, enumerable methods, and finishing touches.

brianmfallsAuthor Commented:
I figured it out.  For reasons I'm still looking into, jQuery wasn't loaded in the iFrame where all the fun is taking place.  I rewrote the script with the standard, non-jQuery equivalent, then changed the class attribute to an id attribute on the counter, and viola!  It works.
echo '<h4>Compiled Data (<span id="changeNumber">', $count, '</span> Records):</h4>';

Open in new window

echo "<script>document.getElementById('changeNumber').innerHTML='$count';</script>";

Open in new window

This iteration simply updates the counter as the data is processed.  It moves in chunks rather than one at a time, but it works none the less.  I'll post up the reverse iteration when I get it done.  Shouldn't be long.  Then I'll split the points between y'all and call it done.  Thanks for the input guys!
brianmfallsAuthor Commented:
Here is the final solution, in all of it's "glory".  Enjoy!

Set the counter variable ($count) and display the initial value.  Display the total.  Display the $count as 'Records Remaining to Process'.  Note: $highestRow is coming from the PHPExcel class.  Our data is coming in from a spreadsheet that the end user uploads.  This will only work if you are looping a significant amount of records and taking some time to process each.  In this case, I am formatting and outputting all of the data to the screen as well as extracting strings from specific columns and creating new column data based off of those strings, then it all goes into the database.  It's busy to say the least.
$highestRow = $sheet->getHighestRow();
$count = $highestRow - 1;
echo "<script>document.getElementById('navigation').innerHTML='';</script>";
echo '<h4>Processing ', number_format($highestRow), ' Records</h4>';
echo '<h4>Records Remaining to Process: <span id="changeNumber">', $count, '</span></h4>';

Open in new window

Within our 'for' loop: Decrement the counter by one, then echo the script from the server side to update the counter on the client side.  It's a bit "hacky", but it does the job.
echo '<script>document.getElementById(\'changeNumber\').innerHTML=\'', number_format($count), '\';</script>';

Open in new window

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
brianmfallsAuthor Commented:

jQuery's progress bar is a great solution, but it wouldn't play nice with what I have.  It would be difficult, if not impossible to shut it down when the processing is complete.  iFrames suck in that respect.  I hate using them, but was left with no option in this instance.  Even though I am calling the iFrame through our existing framework, jQuery isn't loading...  I'm not sure I want to open that bag of worms at the moment, since everything is working, and I have a great deal of work yet to do and not a lot of time to get it done.  I know one thing though, it is being called in through the framework, since I can see the the style sheets are being leveraged.  It seems that only jQuery is awol.

I am currently using a Bootstrap modal loading variant that I was easily able to close post to processing completion.  It looks great, and in addition to the modal and the loading animation, the user can now see the records count down to 0.  It's exactly what I was shooting for.

Thank you VERY much for your valuable input.

brianmfallsAuthor Commented:
I accepted my own solution because it was the actual solution.  The others' input was relevant and helpful in leading me to my solution, which is why I credited them as well.
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today

From novice to tech pro — start learning today.