Javascript timer not looping along with mysql_fetch_array results

Question

<? while($row = mysql_fetch_array($result))
{
$result2 = $row['end_time'];    

echo"<td><div id=defaultCountdown></div></td>"; 
?>

<script type=text/javascript>

$(function () 

{
var t = ('<? echo $result2; ?>').split(/[- :]/);
   // Apply each element to the Date function
var d = new Date(t[0], t[1]-1, t[2], t[3], t[4], t[5]); 
$('#defaultCountdown').countdown({until: d});
$('#year').text(austDay.getFullYear());
});
</script>
    <? }
?>

So basically I wanted to launch the Javascript countdown timer for each row of results generated by mysql_fetch_array. However, in the code above, the timer only works for the first row of result. How do I make the timer work for every row of result?

EDIT

   <td> 2012-12-17 13:12:22</td><td> <img src = Images/1324133424.jpg height=200 width=300 />     </td><td> active</td><td><div id=defaultCountdown0></div></td>    
<script type=text/javascript>

$(function () 

{


var t = ('2012-12-17 13:12:22').split(/[- :]/);


// Apply each element to the Date function
var d = new Date(t[0], t[1]-1, t[2], t[3], t[4], t[5]); 

$('#defaultCountdown0').countdown({until: d});

$('#year').text(austDay.getFullYear());
 });


</script>
<td> 2012-12-01 13:12:22</td><td>     <img src = Images/1322754818.jpg height=200 width=300 /> </td><td> active</td>    <td><div id=defaultCountdown1></div></td>    
<script type=text/javascript>

$(function () 

{


var t = ('2012-12-01 13:12:22').split(/[- :]/);


// Apply each element to the Date function
var d = new Date(t[0], t[1]-1, t[2], t[3], t[4], t[5]); 

$('#defaultCountdown1').countdown({until: d});

$('#year').text(austDay.getFullYear());
});


</script>

You do realize that the PHP side will be long done before the JavaScript even starts? — deceze
– deceze ♦, Commented Dec 24, 2011 at 9:36
Please add the output of this PHP script (i.e. The resulting multiple JavaScript snippets). That is what's needed to debug your code. — Abbas
– Abbas, Commented Dec 24, 2011 at 9:38
You're working under the assumption that PHP and JS will execute at the same time, that's completely incorrect. — sciritai
– sciritai, Commented Dec 24, 2011 at 15:45

Abbas · Accepted Answer · 2013-05-13 08:54:39Z

3

In your PHP while loop, you are setting the same ID for all divs, which is probably why only the first row works. However, as I said in my comment, you need to add the actually JavaScript that is generated by your PHP code.

echo"<td><div id=defaultCountdown></div></td>";

EDIT:

Here's what the code should look like. Run it as it is and then try making small changes to get it to do what you want:

<?
    while($row = mysql_fetch_array($result))
    {
        $i = 0;
        $result2 = $row['end_time'];    
        echo "<td><div id=defaultCountdown$i></div></td>"; 
?>

<script type=text/javascript>
    $(function ()
    {
        var t = ('<? echo $result2; ?>').split(/[- :]/);
        // Apply each element to the Date function
        var d = new Date(t[0], t[1]-1, t[2], t[3], t[4], t[5]); 
        $('#defaultCountdown<?php echo $i; ?>').countdown({until: d});
        $('#year').text(austDay.getFullYear());
    });
</script>

<?
        $i++;
    }
?>

edited May 13, 2013 at 8:54

answered Dec 24, 2011 at 9:40

Abbas

6,8944 gold badges38 silver badges49 bronze badges

Sign up to request clarification or add additional context in comments.

12 Comments

user1033038 Over a year ago

Sorry, a newbie here as I'm not sure of the actual Javascript output. From my understanding, it's supposed to pass the values from PHP to Javascript.I followed the usage in this keith-wood.name/countdown.html script. Can you share an example?

Abbas Over a year ago

The PHP code that you have written writes JavaScript code which is then sent to the browser. What I would like to see is the JavaScript which is now a part of the source of page. On IE, press Alt+v+c to see the page's source. In Chrome and FireFox, press ctrl+u. However, first take care of the ID issue that I pointed out in my reply. You cannot assign the same ID to multiple elements, which is what you are doing in you PHP while loop.

user1033038 Over a year ago

From the Javascript source code, it appears that the Javascript is running correctly. Variable t is also assigned to the respective value from PHP. It's just that there is no output in the browser. You are correct, must be the problem with the multiple same IDs.

user1033038 Over a year ago

However the results are generated dynamically. Does that mean I'll have to put id=defaultCountdown1, id=defaultCountdown2, id=defaultCountdown3, etc? There are many rows generated.

Abbas Over a year ago

Yes, that's what you have to do. Try something like this: $i = 0; echo"<td><div id=defaultCountdown" . $i . "></div></td>";$i++;

|

Collectives™ on Stack Overflow

Javascript timer not looping along with mysql_fetch_array results

1 Answer 1

12 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

12 Comments

Your Answer

Sign up or log in

Post as a guest

Related