Thread: countdown
View Single Post
Old 04-04-2009, 06:31 AM   #6 (permalink)
Krik
The Contributor
 
Join Date: Feb 2009
Posts: 65
Thanks: 0
Krik is on a distinguished road
Default

Now here is were having good programing skills will come into play.

The first issue of counting down instead of up. While I do not wish to be coy in my answer the solution to that is the same as if you were doing it in PHP. Think of the "myfunc" function as a while or a foreach loop. And you have 93 rows of data that need to be looped through and you now wish to loop from the last row to the first. There is a slight difference but the same principle.

I could answer the question directly but as the solution to your second problem is so in depth it will role that solution in with it.

So getting that function to run for multiple rows this will rely heavily on your programing skill.

Is what will be needed, is every second each row needs to be looked at by the function and the value of each row decreased by one.

The real hassle is in communicating which DOM elements the function will be looking at for the value that it must change.

Now I am going to assume that you could have anywhere form 1 to 100's of rows that need to be counting down.

So first we need a good naming convention usually setting element id's that have numbers in them helps. So have PHP make <div> element ids starting at 1. So "mycount1", mycount2, ect. And then have PHP pass the last number to javascript.
PHP Code:
<?php
$rowcount 
15;
?>
<script type="text/javascript">
var rowcount = <?php echo $rowcount?>;
</script>
That "rowcount" in javascript can be set in the last line of the web page if needs be and a javascript function in the head of the page will still be able use it. This is one of the rare exceptions to what I said earlier about placing javascript in the <head> of your page.

So with the number of rows of data set we can now make the javascript function that will count down for all rows.

HTML Code:
<script type="text/javascript">
var nextrow = 1;
var endcount = true;
function multiCountDown(){
    if (nextrow <= rowcount) {
        if (document.getElementById('mycount'+nextrow).innerHTML != 0) {
            document.getElementById('mycount'+nextrow).innerHTML = document.getElementById('mycount'+nextrow).innerHTML - 1;
            endcount = false;
        }
        nextrow++;
        multiCountDown();
    }
    else {
        if(!endcount) {
            nextrow = 1;
            endcount = true;
            counter = setTimeout("multiCountDown();", 1000);
        }
        else {
            clearTimeout(counter);
        }
    }
}
</script>
Of course run the "multiCountDown()" funtion in the onload event.

Note the countdown function will stop once all the rows are at 0.
Krik is offline  
Reply With Quote
The Following User Says Thank You to Krik For This Useful Post:
allworknoplay (04-04-2009)