Date Arithmetic-Row Coloring

Date Arithmetic-Row Coloring

fdbfdb Posts: 5Questions: 2Answers: 0
edited May 2014 in DataTables 1.10

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

  • allanallan Posts: 61,650Questions: 1Answers: 10,094 Site admin

    Dates in Javascript are horrible. What is the value of today? Is it a Date() object? Normally what I do for comparison of dates in Javascript is use the getTime() method of the Date object in order to get a numeric value. You'll need to use Date.parse() for your string representation of the date as well.

    Allan

  • fdbfdb Posts: 5Questions: 2Answers: 0

    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?

  • fdbfdb Posts: 5Questions: 2Answers: 0
    edited May 2014

    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.
    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).

    $(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') }; } ); } );
  • fdbfdb Posts: 5Questions: 2Answers: 0

    /* 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'],

              var dtDue = new Date(aData[9]);
              var dtNow  = new Date();
              if dtDue < dtNow {
                  $('td', nRow).css('background-color', '#FF7F50');
                  $('td', nRow).css('color', 'white') };
    
          } );
      } );
    

    */

This discussion has been closed.