I'm doing a bidding listing page and I wanted to add a countdown timer to it. So, I have this Javascript countdown function which is modified from http://keith-wood.name/countdownBasics.html. I'm supposed to pass the ending time to variable t. I have no problems passing in a direct value such as 2011:11:11 12:00:00, however I want to pass the datetime value from another MySQL column, which is 'ending_time'.

$(function () {
	
	
	var t = ( /*pass the ending time values here. */ ).split(/[- :]/);
	var d = new Date(t[0], t[1]-1, t[2], t[3], t[4], t[5]);	
	$('.defaultCountdown').countdown({until: d});
	
});

I wanted to do a bidding listing page showing the items, ending time,etc and as usual, I did an SQL query and pass the results to mysql_fetch_array and display the results using a while loop below. Now, I would like to add an additional Javascript timer column and start the timer by counting down till the ending time from another column. It should be able to continue looping the results using a while loop until the last row. However, I'm unsure how to output it using the Javascript function above and get it working.

while($row = mysql_fetch_array($result)){
	
/*countdown to this value, DATETIME format*/   echo"<td> $row[ending_time]</td>";    
/*timer column goes here, this should 'call' the Javascrpt timer*/  echo"<td><div class=defaultCountdown></div> </td>";					
											 }

Your assistance is greatly appreciated.

Recommended Answers

All 7 Replies

I'm still a little bit unsure as to what exactly you want to do but I'll try to help. Are you passing the the ending time directly into the javascript function? You could just display all the timers first but hide it with css and have the javascript show the time after it's made.

$('.defaultCountdown').show().countdown({until: d});
//or (if countdown returns this to enable chaining)
$('.defaultCountdown').countdown({until: d}).show();

Like I said, I'm not entirely sure what you're trying to achieve but you might want to take a look at $.ajax() since thats the best way to have PHP and JS talk to each other and also take a look at json_encode();

@see: http://api.jquery.com/jQuery.ajax/
@see: http://php.net/manual/en/function.json-encode.php

Member Avatar for diafol
$r = mysql_query("SELECT endtime FROM bids WHERE bid_id = 7 LIMIT 1");
$d = mysql_fetch_array($r);
$countbegin = $d['endtime'] - time(); //countdown start in seconds if endtime as timestamp

to use with a regular countdown script (not Keith's - which I must say looks v. nice).

Member Avatar for diafol

For Keith's:

<script>
...
<?php echo "var mydate = new Date({$t[0]}, " . ($t[1]-1) . ", {$t[2]}, {$t[3]}, {$t[4]}, {$t[5]});";?>
$('#some_div').countdown({until: mydate, format: 'DHMS'});
...
</script>
$r = mysql_query("SELECT endtime FROM bids WHERE bid_id = 7 LIMIT 1");
$d = mysql_fetch_array($r);
$countbegin = $d['endtime'] - time(); //countdown start in seconds if endtime as timestamp

to use with a regular countdown script (not Keith's - which I must say looks v. nice).

How do I put that query at the same table along with other columns(listing no., ending time, price, etc)? I wanted every row of listing to have the countdown timer.

Thanks

Member Avatar for diafol
<table>
  <thead>
    <tr>
       <th>Lisitng No.</th><th>Ending Time</th><th>Price</th><th>Time Left</th>
    </tr>
  </head>
  <tbody>
    <tr>
       <td><?php echo $row['lno'];?></td><td><?php echo $row['endtime'];?></td><td><?php echo $row['price'];?></td><td id="some_div">&nbsp;</td>
    </tr>
  </tbody>
</table>

something like that??

How about the looping part since I need to display the results for all rows? I'm not sure how to loop the timer. Hope you understand.

Member Avatar for diafol

I understand, but I think I've helped enough. There is scope for you to do some of the work yourself now.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.