I have a table (generated from a php array) that shows a users current auctions. One of the columns of this table shows the time remaining in the auction. I am using a jquery countdown plugin ( http://www.keith-wood.name/countdown.html ) that makes the remaining time countdown to zero.
How can I apply the countdown function to every row using the different remaining times?
$(function () {
$('#countdown').countdown({until: +remainingTime, format: 'HMS', compact: true});
});
what I am trying, but doesn't seem to be working:
foreach($tradePile['auctionInfo'] as $auction)
{
if ($auction['tradeState'] == "active")
{
$i++;
echo '<tr>';
echo '<td><a href="player.php?id='.$auction['itemData']['resourceId']. '">'.$stats['first_name'].' '.$stats['last_name'].'</a></td>';
echo'<td>'.$auction['itemData']['rating'].'</td>';
echo'<td>'.$buyNowPrice.'</td>';
echo'<td>'.$auction['startingBid'].'</td>';
//remaining time for each auction:
//$auction['expires']
?>
<td>
<script>$(function () {$('#countdown<?php echo $i; ?>').countdown({until: +<?php echo $auction['expires'] ?>, format: 'HMS', compact: true});});</script>
<div id="countdown<?php echo $i; ?>"></div>
</td>
<?php
echo'</tr>';
}
}
Use each to loop through all the table row. Do not write JS script with PHP.
Create table structure like this defining the id with your incremental i
variable:
<table id="myTable">
<tr id="1" expire="55">
<td id="countdown-1">....</td>
...
</tr>
</table>
And JS code like that :
$(function () {
$('#myTable tr').each(function(){
var remainingTime = $(this).attr('expire');
var id = $(this).attr('id');
$('#countdown-'+id).countdown({until: +remainingTime, format: 'HMS', compact: true});
});
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.