...

View Full Version : jQuery Comparing dates in a table



harbingerOTV
10-25-2010, 07:48 PM
My turn to ask ;)

I have a table basically like this:


<tr>
<td>09.11.2010</td><td>11:30 AM</td><td>Location</td><td>Team</td><td>Outcome</td>
</tr>
<tr>
<td>10.29.2010</td><td>11:30 AM</td><td>Location</td><td>Team</td><td>Outcome</td>
</tr>
<tr>
<td>11.7.2010</td><td>11:30 AM</td><td>Location</td><td>Team</td><td>Outcome</td>
</tr>

What I am trying to do is grab the first cell (the date) and that's easy enough. What I am struggling with is comparing that date to today's date. If it's in the past ignore it. If it's in the future and the first one in the future, do my function.

So in the sample table above, it would ignore the first line, stop at the second as it's the next date from today and run my function.

I just need a hand converting today into a string that I can compare to the data in the table correctly.

Essentially I think the start is somethign liek:


function nextGame() {
$('#foo').load('schedule.html .scheduletable', function() {
$('#foo tbody tr').each(function(){
var startdate= $(this).children('td:eq(0)').text();
// beats me
});
});
}

SB65
10-25-2010, 08:05 PM
I just need a hand converting today into a string that I can compare to the data in the table correctly.

This will convert today's date to dd.mm.yyyy:


var now = new Date();
var $datestring = now.getDate()+"."+(1+parseInt(now.getMonth()))+"."+now.getFullYear();


EDIT: You'll want mm.dd.yyyy of course, being transatlantic....

SB65
10-26-2010, 07:20 AM
I missed the leading zero on that...

..but, it would be better I think to convert your string to a date before comparison - this would make the past/future thing easier.

So:



var startdate= $(this).children('td:eq(0)').text();
startdate = startdate.replace(/[.]/g,"/");//replace dots with slashes
var checkdate = new Date(startdate);//convert to a date
var now = new Date();
if (checkdate < now).....do whatever

harbingerOTV
10-26-2010, 06:24 PM
@SB65,

Awesome, thanks so much. Some reason I've never wrapped my head around JS dates. With your help my script ballooned up to what I wanted it to be:


$('#foo .scheduletable tbody tr').each(function(){
startdate= $(this).children('td:eq(0)').text();
startdate = startdate.replace(/[.]/g,"/");//replace dots with slashes
checkdate = new Date(startdate);//convert to a date
now = new Date();
now.setHours(0,0,0,0);
//alert(checkdate);
//alert(now);
if (checkdate < now){
$(this).remove();
}
});
gamedate = $('#foo .scheduletable tbody tr:eq(0)').children('td:eq(0)').text();
gamedate = gamedate.replace(/[.]/g,"/");
gamedate = new Date(gamedate);
now = new Date();
now.setHours(0,0,0,0);
if(gamedate <= now){
mensGameLeader = 'Today\'s Men\'s Game:';
} else {
mensGameLeader = 'Next Men\'s Game:';
}
//alert('gamedate= '+gamedate2+' :: now= '+now);
mensDate = $('#foo .scheduletable tbody tr:eq(0)').children('td:eq(0)').text();
mensTime = $('#foo .scheduletable tbody tr:eq(0)').children('td:eq(1)').text();
mensLocation = $('#foo .scheduletable tbody tr:eq(0)').children('td:eq(2)').text();
mensOpponent = $('#foo .scheduletable tbody tr:eq(0)').children('td:eq(3)').text();

if(mensDate != ''){
$('#nextGame').append('<div class="mensGame"><b>' + mensGameLeader + '</b> ' + mensDate + ' - ' + mensTime + ' @' + mensLocation + ' vs. ' + mensOpponent + '</div>');
$('#nextGame').animate({'width' : '940px'}, 600).delay(2000).queue(function(){
womensGame();
});
}

Then a similar function for the Woman's team.

Your guidance helped me doing:

now.setHours(0,0,0,0);
if(gamedate <= now){
mensGameLeader = 'Today\'s Men\'s Game:';
} else {
mensGameLeader = 'Next Men\'s Game:';
}

as well to indicate that a game was on the current day.

Pretty sweet, thanks again!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum