How to highlight a table row based on a date?

  • 1
  • Question
  • Updated 3 years ago
  • Answered
I'm not at versed in Javascript but can usually hack my way around...however, I'm having an issue with a HighlightRow snipped based on an opportunity expiration date.  

I've successfully created a row highlight snipped based on a specific value in the past (using  (field.mode == 'readonly' && value === "P")  but I don't know how to write an argument that would change use a date.  

Here is my HighlightRow snippet that changes a row color when a cell value contains "P":

var field = arguments[0], 

value = skuid.utils.decodeHTML(arguments[1]); 

skuid.ui.fieldRenderers[field.metadata.displaytype][field.mode](field,value); 

if (field.mode == 'readonly' && value === "P") 

    { 

        field.item.element.addClass("LeadTab_highlighted-row");


    }

How can I write a snippet that applies a Class when a date in a cell is less than today's date?

Thanks!

Gary
Photo of Gary Bailey

Gary Bailey

  • 1,628 Points 1k badge 2x thumb
  • hopeful the community will help me

Posted 3 years ago

  • 1
Photo of Matt Sones

Matt Sones, Champion

  • 31,478 Points 20k badge 2x thumb
You should be able to use something like this:

var field = arguments[0], 
value = skuid.utils.decodeHTML(arguments[1]),
jsDateValue = skuid.time.parseSFDate(value); skuid.ui.fieldRenderers[field.metadata.displaytype][field.mode](field,value);
 if (field.mode == 'readonly' && (jsDateValue < new Date() )) { field.item.element.addClass("LeadTab_highlighted-row");
 }
(Edited)
Photo of Gary Bailey

Gary Bailey

  • 1,628 Points 1k badge 2x thumb
Thanks for taking a look at this!  

I'm getting this error:

Uncaught TypeError: skuid.utils.parseSFDate is not a function
Photo of Matt Sones

Matt Sones, Champion

  • 31,478 Points 20k badge 2x thumb
Sorry about that. I edited the comment right after I posted it. It should be skuid.time...
It's corrected above.
Photo of Gary Bailey

Gary Bailey

  • 1,628 Points 1k badge 2x thumb
Ok, no error...it is applying the class but now it's not changing the color of the row.  

Here is my CSS:

tbody.nx-skootable-data tbody tr.LeadTab_highlighted-row  {                    
   background-color: #F05423;
}

Here is Matt's snippet:

var field = arguments[0], value = skuid.utils.decodeHTML(arguments[1]),
jsDateValue =  skuid.time.parseSFDate(value);
skuid.ui.fieldRenderers[field.metadata.displaytype][field.mode](field,value); 
 if (field.mode == 'read' && (jsDateValue < new Date() )) 
    { 
        field.item.element.addClass("LeadTab_highlighted-row");
 }

Again, I'm successfully using this on other pages with that CSS...so I don't think the issue is with the CSS.  
Photo of Matt Sones

Matt Sones, Champion

  • 31,478 Points 20k badge 2x thumb
Try this instead for the css:

table.nx-skootable-data tbody tr.LeadTab_highlighted-row td {    
   background-color: #F05423;
}
(Edited)