How do I disable open ended text in one column if the checkbox is selected in the preceding column? | XM Community
Skip to main content

I have a side by side question with two columns. Ideally, if, for any of the four statements, "None" is checked in column one (allowing for multiple answers), the open ended text entry in the subsequent column for that row would be disabled. Is this possible?
Screenshot 2023-01-23 at 11.58.07 AM.png

Use this on addOnload funtion for each row.
jQuery("#id of checkbox").click(funtion(){
if(jQuery("#id of checkbox").is(":checked"){
jQuery("#id of text box").prop("disabled",true);
}
if(!jQuery("#id of checkbox").is(":checked"){
jQuery("#id of text box").prop("disabled",false);
}
});


https://community.qualtrics.com/XMcommunity/discussion/comment/54404#Comment_54404Hi, thanks for this. I've been trying to make this work and I keep running into an unexpected identifier error. I'm relatively new to this so if you have any suggestions on how to solve that I would greatly appreciate it! Here is the code I've been trying for the first row:

jQuery("#QR~QID38#1~1~1").click(funtion(){

if(jQuery("#QR~QID38#1~1~1").is(":checked"){

jQuery("#QR~QID38#2~1~1~TEXT").prop("disabled",true);

}

if(!jQuery("#QR~QID38#1~1~1").is(":checked"){

jQuery("#QR~QID38#2~1~1~TEXT").prop("disabled",false);

}

});



Since # ~ are special characters and used for different reason in jquery. So you will need to escape these special characters through double back slash \\\\. Please refer below.
jQuery("#QR\\\\~QID38\\\\#1\\\\~1\\\\~1").click(funtion(){
if(jQuery("#QR\\\\~QID38\\\\#1\\\\~1\\\\~1").is(":checked"){
jQuery("#QR\\\\~QID38\\\\#2\\\\~1\\\\~1\\\\~TEXT").prop("disabled",true);
}
if(!jQuery("#QR\\\\~QID38\\\\#1\\\\~1\\\\~1").is(":checked"){
jQuery("#QR\\\\~QID38\\\\#2\\\\~1\\\\~1\\\\~TEXT").prop("disabled",false);
}
});


https://community.qualtrics.com/XMcommunity/discussion/comment/54424#Comment_54424Thanks again, and thanks for helping me; I'm new to using Javascript to build my surveys! When I try this code, I keep getting an "unexpected identifier" code. Any suggestions?


There is a typo, spelling of function was wrong. Please check now.
jQuery("#QR\\\\~QID38\\\\#1\\\\~1\\\\~1").click(function(){
if(jQuery("#QR\\\\~QID38\\\\#1\\\\~1\\\\~1").is(":checked"){
jQuery("#QR\\\\~QID38\\\\#2\\\\~1\\\\~1\\\\~TEXT").prop("disabled",true);
}
if(!jQuery("#QR\\\\~QID38\\\\#1\\\\~1\\\\~1").is(":checked"){
jQuery("#QR\\\\~QID38\\\\#2\\\\~1\\\\~1\\\\~TEXT").prop("disabled",false);
}
});


https://community.qualtrics.com/XMcommunity/discussion/comment/54470#Comment_54470I'm still running into an error. I tried plugging that into an online syntax validator and it's flagging the "if" in "if(!jQuery("#QR\\\\~QID38\\\\#1\\\\~1\\\\~1").is(":checked"){" as an unexpected token. I'm not sure that's helpful.


Hi jtboelter
You can add following code inside your Qualtrics addoOnReady function in JS API to achieve the above task:
//access to the question div
let ques=document.getElementById('Questions');
//access to the text box
let text=document.querySelectorAll("input[type=text]");
               //access to the radio buttons
   let radio=document.querySelectorAll("inputStype=checkbox]");
               //validates if selected  is clicked and then disables the matching text box
ques.addEventListener("click", function(){
               for(let j=0;jif(radioj].checked)
{textdj].disabled="true";
text[j].value="";} //if the respondent has entered any value so to clear the text box before submitting

 else
   {textxj].removeAttribute("disabled")} //enables the text box if option is deselected
   } });

image.png


Thanks qualtrics_nerd !! This did the trick. And thanks ArunDubey for following up to all of my questions.


Sorry jtboelter , as I was missing clossing ) brackets too under if condition in below script. As my laptop is not working and I was writing code through phone so I was not able to check it. You can try this once and let me know if it's working. Thanks!!

jQuery("#QR\\\\~QID38\\\\#1\\\\~1\\\\~1").click(function(){
if(jQuery("#QR\\\\~QID38\\\\#1\\\\~1\\\\~1").is(":checked")){
jQuery("#QR\\\\~QID38\\\\#2\\\\~1\\\\~1\\\\~TEXT").prop("disabled",true);
}
if(!jQuery("#QR\\\\~QID38\\\\#1\\\\~1\\\\~1").is(":checked")){
jQuery("#QR\\\\~QID38\\\\#2\\\\~1\\\\~1\\\\~TEXT").prop("disabled",false);
}
});


Leave a Reply