Using CSS display:none to hide answer choice | XM Community
Skip to main content

Hi!
My survey has questions where the answer choices depend on answers to prior questions. I want to not offer an answer choice if these prior questions are skipped.
For example:
Q1: Which of these schools do you prefer most?
School1
School2

Question 2 [Slider bars]: How far are the following schools from your house?
School A
School B
[Choice selected in Q1]

If someone skips Q1, then the third slider in Q2 is unlabeled. I want to set the display logic for the third slider in Q2 such that it does not display if Q1 is skipped.
I found a solution in another forum that I think will work:

  1. Add a default response option "WEB SKIP" to Q1

  2. Add display logic to Q2 to suppress the third slider if Q1 skipped.

  3. In the survey CSS apply a display:none; style to the "WEB SKIP" option in Q

Unfortunately I do not know how to do step 3 (I have never used CSS or programmed in Java). If someone has some example code that could be used here, that would be great! Thank you!

Hi, An alternate way would be to create two version of the question Q2, one with the Q1 selected choice and one without it, then you can use display logic on those 2 questions to show based on Q1 choice selection.


Thank you ChiragK. Yes that would work but the survey has many questions like Q2 and Q1 has a large number of options, so having multiple versions of all the Q2s and complicated display logic gets unwieldy very quickly.


Leave a Reply