Solved

Change the color of a multiple choice box based on the choice description?

Forum|Forum|5 years ago
November 20, 2020
2 replies
88 views

kniss293

Hello,
I have a multiple choice question with numerous appointment slots. The MC choices are programmed to show appointments in the five business days after the survey is accessed. Once a participant chooses an appointment slot, the choice will disappear for other users automatically (until I reset the quota for that slot).
This is what the question looks like so far:
Screen Shot 2020-11-18 at 8.24.26 PM.png I'd like each MC box to be a certain color depending on which day of the week it shows. For example, all boxes starting with "Monday" would be red, all boxes starting with "Tuesday" would be orange, and so on. This should hold even when the number of appointments per weekday changes.
I've seen a few posts already on changing MC text color already (e.g., https://www.qualtrics.com/community/discussion/2877/net-promoter), but I'm not too familiar with Javascript and I'm having trouble using the Qualtrics functions. Thank you in advance for any feedback or suggestions!

Best answer by kniss293

Here is the output of the above code (after changing the color scheme slightly):
Screen Shot 2020-12-05 at 6.18.55 PM.png

K

kniss293
Author
Forum|Forum|5 years ago
December 6, 2020

In case anyone is curious, I came up with a working solution:
Qualtrics.SurveyEngine.addOnReady(function()
{
var d={"Monday":"#fbefcc", "Tuesday":"#f4e1d2", "Wednesday":"#f9ccac", "Thursday":"#ffad87", "Friday":"#eea29a"};

for(var i=0;i<=32;i++){
for( var day in d){
var TODAY=jQuery("#"+this.questionId+"label.SingleAnswer:eq("+i+")").text();
if(TODAY.includes(day)){
jQuery("#"+this.questionId+"label.SingleAnswer:eq("+i+")").css("background",d[day]);
}
}
}
});