Date Arithmetic-Row Coloring
Date Arithmetic-Row Coloring
I'm trying to do something which should be simple and having lots of trouble, principally because I'm not that good at programming yet, I think. I've got a datatable that has a due date column in it (2014-04-30, for example). I want to compare that date with todays date and if the due date is less than todays date, color the row. I'm using fnRowCallback which I can get to work with string values but not with dates. The data is being pulled from mySQL using "ajax": "server_processing.php". I'm trying to do something similar to:
if aData[9] < today {
$('td', nRow).css('background-color', '#FF7F50');
$('td', nRow).css('color', 'white');
If I use if (aData[5] == 'Mary') { ...
the row colors properly. 'm doing something wrong when comparing dates though and can't quite figure out what it is. I'll change this to pass a class like .highlight when I get it working properly. Any help would be tremendously appreciated.
Answers
Dates in Javascript are horrible. What is the value of
today
? Is it aDate()
object? Normally what I do for comparison of dates in Javascript is use thegetTime()
method of theDate
object in order to get a numeric value. You'll need to useDate.parse()
for your string representation of the date as well.Allan
Alan, thanks for the quick response and thanks for this wonderful product. Its fabulous!
The concept is simple enough. Pull a row, look at the date field, compare it to today's date and highlight the row if the table date is in the past, eg, this thing should have been done by now and has not been, so highlight the row to bring it to the users attention.
The execution is harder than I thought. I created two variables! Assigning the first the adata[9] value wrapped in date(). The second I tried Date.now, (and a number of others) and tried comparing. I get Nada.
I'm not that good at JavaScript. I'm wondering if maybe I should be doing something in server-processing.php to Id the row as they are extracted from the db? You thoughts?
As a follow up, if id do this in jsbin:
var dtDue = new Date("2014-04-30"); var dtNow = new Date(); if (dtDue < dtNow) { document.write("Past Due"); }I get "Past Due" which indicates that the math is working.
whereas this (in my working code) produces no rows at all in the table.
$(document).ready(function() { $('#unfiled').dataTable( { "processing": true, "serverSide": true, "ajax": "server_processing.php", "aaSorting": [9,'asc'], var dtDue = new Date(aData[9]); var dtNow = new Date(); if dtDue < dtNow { $('td', nRow).css('background-color', '#FF7F50'); $('td', nRow).css('color', 'white') }; } ); } );I'm confused. The table was populated before I added the date code section. What am I doing wrong? I'm sure it's something stupid (operator error).
/* sorry, the code did not come through with the last post - here it is:
jsbin code (inside <script> tags:
var dtDue = new Date("2014-04-30");
var dtNow = new Date();
if (dtDue < dtNow)
{ document.write("Past Due"); }
my working code (also in script tags):
$(document).ready(function() {
$('#unfiled').dataTable( {
"processing": true,
"serverSide": true,
"ajax": "server_processing.php",
"aaSorting": [9,'asc'],
*/