Change the color of a multiple choice box based on the choice description? | XM Community
Skip to main content

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.pngI'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!

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",ddday]);
}
}
}
});

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

Leave a Reply


Terms & Conditions