Skip to main content
Nintex Community Menu Bar
Question

Change formatting of Table Row based on field value


Did this topic help you find an answer to your question?
Show first post
This topic has been closed for comments

37 replies

Forum|alt.badge.img+5

Ryan,

I was able to get this working in the end for me. I had to pick one field on the table and render it as the snippet to get this working. Do you have one of your fields rendering as this snippet, because your code looks okay to me…

Translate

Forum|alt.badge.img+5

That worked thanks! I didn’t assign the snippet to a separate field.

Translate

Forum|alt.badge.img+5

No problem! Glad to help!

Translate

Forum|alt.badge.img+5

I’ve used this on a bunch of tab pages successfully. Is there any reason it wouldn’t work on a table on a detail page? If not I can’t see where I have gone wrong. I have tried with the field on the table and without. Same logic, highlight a row where a checkbox is marked as true. 

I’ve tried read/readonly. 

Snippet:

var field = arguments[0];var value1 = arguments[1];
var row = field.row;
var value2 = row.Flag__c;

skuid.ui.fieldRenderers[field.metadata.displaytype]field.mode

if ((field.mode == ‘readonly’) && (value2 === true))



field.item.element.addClass(“flag_highlighted-row”);

}

CSS:

table.nx-skootable-data tbody tr.flag_highlighted-row td {    
   background-color: #ffffcc;

}

Translate

Forum|alt.badge.img+10
  • 326 replies
  • July 9, 2024

I am using a very similar script on a table without issue. I could be mistaken but maybe change this line

if ((field.mode == 'readonly') && (value2 === true))


to

if (field.mode == 'readonly' && value2 === true)
Translate

Forum|alt.badge.img+5

Thanks. Just tried it but still didn’t work unfortunately. 

Translate

Forum|alt.badge.img+5

Hi Emily, I am having the same issue Matt did. The render is correctly applying the css class but the table won’t change. Except I used your suggestions for the css selector already. CSS is: table.nx-skootable-data tbody tr.LeadTab_highlighted-row td { background-color: LightCoral; } Snippet is : var field = arguments[0], value = skuid.utils.decodeHTML(arguments[1]); skuid.ui.fieldRenderers[field.metadata.displaytype]field.mode; if (field.mode == ‘read’ && value === true) { field.item.element.addClass(“LeadTab_highlighted-row”); }557712f8b7ee2cd512049be15d82e14b3e683ede.png

Translate

Forum|alt.badge.img+17
  • Nintex Employee
  • 3763 replies
  • July 9, 2024

If the class is being applied but you are not getting the expected results - it either is because the class is not defined correctly (and all the properties are getting thrown out) or it is because there is another div sitting on top of your special one that is blocking it. 

Translate

Forum|alt.badge.img+5

Your second idea worked. There was a problem with the CSS used in a map I had on the page. I thought I had tested it without the map already. Works now thanks!

Translate

Forum|alt.badge.img+7
  • 53 replies
  • July 9, 2024

I want to do this but is there a new way or where can I find the sample page that was created. Link is dead

Translate

Forum|alt.badge.img+17
  • Nintex Employee
  • 3763 replies
  • July 9, 2024

Chad - we moved things around in our Sample Page repo this year. Here is a corrected link to the Conditional Row Highlighting page:

https://github.com/skuid/SamplePages/blob/master/xx_Holding/Conditional%20Row%20Highlighting%20(Lead%20List)

A note. In our upcoming release we will be delivering declarative ways to do this in the V2 page api. We already have conditional styling that can be applied to components. So you could already change the background color of a form if “do-not-call” = true. But what is coming is targeting individual table fields or rows with this styling change.

I don’t know if you are exploring the V2 API at all - (I hope you are cuz its awesome!) - but you might consider that…

Its good to see you here. I hadn’t heard your name in a while… Hope the app is doing well.

Translate

Forum|alt.badge.img+7
  • 53 replies
  • July 9, 2024

thanks for the help. good to be seen

Translate

Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie Settings