Change font color based on participant's response | XM Community
Skip to main content
I have a matrix table question with a profile, drop down list where respondents select whether they want to include certain statements or terms into a contract. If they select "include," I'd like the font color of the corresponding statement to change from black to green, while the statements that are not selected should remain black. Is there a way to change the font color of a statement based one's selection? I've tried a few workarounds, but I would prefer that the font color changes appear immediately rather than on the next page. Another solution that may require less work is programming a pick, group, and rank question so that the items change color once they are placed in a group. In other words, I'm imagining the items turning from black to green as they are dragged over to a group, labeled "preferred terms for a contract." Both requests probably involve custom javascript coding, but any tips about finding a solution would be much appreciated. Thank you!
Hello @rcorser ,



This is for PGR setup



Use the below CSS:



.groupsContainerTd .PGRSortable {

color:green;

}
I'm probably missing a step. After going to Look & Feel--> Advanced --> Add custom CSS, I copy and paste the code. When I preview the survey, I do not see the PGR changing color. Any ideas?
> @rcorser said:

> I'm probably missing a step. After going to Look & Feel--> Advanced --> Add custom CSS, I copy and paste the code. When I preview the survey, I do not see the PGR changing color. Any ideas?



I tested this and it works!

Can you share the QSF
Sure thing, thank you for taking a look!
> @rcorser said:

> Sure thing, thank you for taking a look!



Please check it is `.groupsContainerTd` no `groupsContainerTd ` . A dot is missing at the start
Great, thank you for catching that. Any chance a similar color change is possible with a matrix drop down question (.qsf attached)? I tried using the rich content editor to color code drop down choices (i.e., "include" vs "do not include") but alas it doesn't show up as expected in the survey preview mode.

Leave a Reply