How to show/hide subsequent questions based on previous answer | XM Community
Skip to main content

Hello! I am trying to determine the custom code/javascript to display columns based on a previous "multiple-answer" response. Basically to "grey-out" responses to make it impossible to answer (if a previous box is checked). Being able to select and deselect the initial box is critical.
Attached are two pictures of what I am trying to accomplish.
Thank you for the help in advance!
Before:
Before.PNGAfter:
After.PNG


https://community.qualtrics.com/XMcommunity/discussion/24159/how-to-show-hide-subsequent-questions-based-on-previous-answerYou can accomplish this via custom coding. There is no OOTB method to do this.
Hope it helps!

Hi Deepakjbeyer000
I have copied your structure as below:

image.pngimage.pngJust copy below code in above question JS API:
Qualtrics.SurveyEngine.addOnload(function()
{
/*Place your JavaScript here to run when the page loads*/


});
Qualtrics.SurveyEngine.addOnReady(function()
{
let qcheck=document.querySelectorAll("input[type=checkbox]");
let qradio=document.querySelectorAll("input[type=radio]");
let td=document.querySelectorAll("td.AnswerCell") ;
for(let i=0;i    {
        qcheck[i].addEventListener("change",checkdisable);
    }
function checkdisable() {
  for(let i=0; i    if(qcheck[0].checked && i<8) {
      if(qradio[i].checked) {
        qradio[i].checked = false;
      }
      qradio[i].disabled=true;
        
    }
    else if(qcheck[1].checked && i>=8 && i<16) {
      if(qradio[i].checked) {
        qradio[i].checked = false;
      }
      qradio[i].disabled=true;
       
    }
    else if(qcheck[2].checked && i>=16 && i<24) {
      if(qradio[i].checked) {
        qradio[i].checked = false;
      }
      qradio[i].disabled=true;
       
    }
    else {
      qradio[i].disabled=false;
    }
  }
  if(!qcheck[0].checked && !qcheck[1].checked && !qcheck[2].checked) {
    for(let i=0; i      qradio[i].disabled=false;
    }
  }

  for(let i=1; i    if(qcheck[0].checked && i<9) {
    
      td[i].style.background="#9b9b9b";  
    }
    else if(qcheck[1].checked && i>9 && i<18) {
     
      td[i].style.background="#9b9b9b";
       
    }
    else if(qcheck[2].checked && i>18 && i<=26) {
      
      td[i].style.background="#9b9b9b";
       
    }
    else {
        td[i].style.background="white";
    }
  }
  if(!qcheck[0].checked && !qcheck[1].checked && !qcheck[2].checked) {
    for(let i=1; i        td[i].style.background="white";
    }
  }
  
}
});
Qualtrics.SurveyEngine.addOnUnload(function()
{
/*Place your JavaScript here to run when the page is unloaded*/


});
It works like below:
image.png

Hope this resolves your query😊!!

Terms & ConditionsAccessibility statement