Add scale labels to stars type slider question | XM Community
Skip to main content
Michael_Cooksey
Administrator
20 days ago
Solved

Add scale labels to stars type slider question

L
Hi everyone, Is it possible to add scale labels above/below the stars type slider question? Similar to other question types where labels are optional, I'd like to display "Never, Maybe, Definitely" below the scale. Please see the screen capture below: ! Thanks in advance!

Best answer by Kate

There is some advice on another thread. The idea would be to use the regular scale, but alter the radio buttons to display as starts- rather than try to add labels to the stars: https://www.qualtrics.com/community/discussion/comment/11833#Comment_11833
View original

3 replies

K
Level 5 ●●●●●
Forum|alt.badge.img+19
  • Kate
  • Level 5 ●●●●●
  • 543 replies
  • Answer
  • March 4, 2019
There is some advice on another thread. The idea would be to use the regular scale, but alter the radio buttons to display as starts- rather than try to add labels to the stars: https://www.qualtrics.com/community/discussion/comment/11833#Comment_11833
L
S
2 people like this
  • L
    Lesliejl
  • S
    ScottG
V
  • Vikas
  • 11 replies
  • November 30, 2020

Does anyone has answer to the above? Thread shared in the comment above is not getting the answer I am looking for. My requirement is exactly as per the question.

V
  • Vikas
  • 11 replies
  • December 22, 2020

Lesliejl - I have applied the below java script on addOnload and working well for me.

console.log("ResultsInput :"+$$('.ResultsInput')[0].value);

jQuery('.StarsEventWatcher').on('touchend click',function(){

jQuery(".SatisfactionIndex").remove();
if($$('.ResultsInput')[0].value == 1){
$(this).parentNode.appendChild(QBuilder('div',{},'Not at all satisfied'));
}else if($$('.ResultsInput')[0].value == 2){
$(this).parentNode.appendChild(QBuilder('div',{},'Somewhat satisfied'));
}if($$('.ResultsInput')[0].value == 3){
$(this).parentNode.appendChild(QBuilder('div',{},'Satisfied'));
}if($$('.ResultsInput')[0].value == 4){
$(this).parentNode.appendChild(QBuilder('div',{},'Very satisfied'));
}if($$('.ResultsInput')[0].value == 5){
$(this).parentNode.appendChild(QBuilder('div',{},'Extremely satisfied'));
}
jQuery(".StarsContainer div:last").addClass("SatisfactionIndex");
jQuery(".SatisfactionIndex").css("font-size", "12px");
jQuery(".SatisfactionIndex").css("text-align", "center");
jQuery(".SatisfactionIndex").css("color", "rgb(153, 153, 153)");
});

Leave a Reply


Terms & Conditions