How to hide text when answer option is not selected | XM Community
Skip to main content

I'm writing a survey for a client who has written some very long explanations to describe each survey answer option. What I'd like to do is hide the full description while keeping a shorter version of the text visible. On click, I want to expand the answer option to include the full text.
I tried wrapping part of the answer option in a separate

and setting the style as "display:none;" and using this javascript (but it didn't work):
Qualtrics.SurveyEngine.addOnload(function ()
{
  this.questionclick = function(event,element){
    //for a single answer multiple choice question, the element type will be radio
    if (element.type == 'radio')
    {
      element.children0].childrenc0].style.display = "block"
    }
  }
});

Any suggestions?

Instead of JavaScript, a friend recommended using the following CSS:

.Skin label.SingleAnswer.q-checked span div {
display: block !important;
}

It totally worked! Feel free to use this trick. It makes for a much better user experience with large blocks of text.

Leave a Reply


Terms & Conditions