Hi all. I'm working on a html table that will display the status of various auctions. I am using two different jquery plugins: Keith Wood's countdown timer
http://keith-wood.name/countdown.html[
^] and the jquery tablesorter
http://tablesorter.com/docs/[
^]. I use these because I'm not super fluent in jquery. My strength is c# and .net languages. Anyway, there are around 35 different items that will be displayed on this page. Each with a time left field. My job is to be able to place the countdown clock inside of each row in the table that will countdown the time. I know how to do it once:
<div class="countdown-styled" style="width:200px;">
With this jquery code:
$(function() {
var endDate = new Date();
endDate.setFullYear(#cYear#,#cMonth#-1,#cDay#);
endDate.setHours(#cHour#+1);
endDate.setMinutes(#cMinute#);
endDate.setSeconds(#cSecond#);
$('.countdown-styled').countdown({
until: endDate,
format: 'dHMS',
render: function(data) {
var el = $(this.el);
el.empty()
.append("<div>" + this.leadingZeros(data.days, 2) + " <span>days</span></div>")
.append("<div>" + this.leadingZeros(data.hours, 2) + " <span>hrs</span></div>")
.append("<div>" + this.leadingZeros(data.min, 2) + " <span>min</span></div>")
.append("<div>" + this.leadingZeros(data.sec, 2) + " <span>sec</span></div>")
}
});
});
That's easy. What I don't know is how to include multiple instances of this inside of each table row with a unique time for each item.
Here is my current code for building the table. The server language is ColdFusion. The data is retrieved from the serve by a cfquery and then outputted inside the tbody:
<tbody>
<cfoutput query="MyQuery">
<tr>
<td>#MyQuery.ItemNum#</td>
<td>#MyQuery.HighBidNum#</td>
<!--
<cfif auctionclosenum GT 999>
<cfset cYear=Left(AuctionCloseNum, 4)>
<cfset cMonth=Right(Left(AuctionCloseNum, 6), 2)>
<cfset cDay=Right(Left(auctionclosenum, 8), 2)>
<cfset cSecond=Right(left(auctionclosenum, 14), 2)>
<cfset cMinute=Right(left(auctionclosenum, 12), 2)>
<cfset cHour=Right(left(auctionclosenum, 10), 2)>
<cfset Date="#cMonth#/#cDay#/#cYear#">
<cfset Time="#cHour#:#cMinute#:#cSecond#">
<cfset DateTime="#TimeFormat(Time, "h:mm tt")#<br>#DateFormat(Date , "ddd MMM D")#">
</cfif>
<!--
<td>#DateTime#<div class="countdown-styled" style="width:200px;"></div></td>
<!--
<cfset cHighBid=DollarFormat(HighBid)>
<td>#cHighBid#</td>
</tr>
</cfoutput>
</tbody>
Can anyone help me please?