How to hide radio button element in matrix question | XM Community
Skip to main content
Hello!



I am struggling with hiding radio button element in Qualtrics. I have a transposed matrix question, and I am trying to hide some specific radio buttons.



I was trying to use below codes:



<code>$('QR~QID392~5~14').hide(); </code>



<code>$('QR~QID392~5~14').style.visibility = 'hidden';</code>



However none of them is working. Would be grateful for any advice!
Hello @Piotr ;



Use following code `jQuery("[id='QR~QID392~5~14']").hide();`



But in order to hide qualtrics radio button, we need to use td tag's class to target.
Hi Shashi,



Thank you for the prompt answer. I have been trying to use this code in Javascript functionality:



<quote>

Qualtrics.SurveyEngine.addOnload(function()

{

jQuery("[id='QR~QID392~5~14']").hide();

});

</quote>



However it doesn't work for me. I am not sure if I am using it correctly, or I should use it in CSS code? And if it comes to those tag's class, where I can find it? Sorry if my questions are dummy, I am learning this on the run. 🙂
Hide the contents of a matrix cell:

```

var cell = "5~14";

jQuery(("#QR~"+this.questionId+"~"+cell).replace(/~/g, "\\\\~")).closest("td").find("*").hide();

```
@TomG Works perfectly! Thanks a lot.
@TomG , This code is hiding the button but when i click on this are i am able to proceed.
> @PeeyushBansal said:

> @TomG , This code is hiding the button but when i click on this are i am able to proceed.



In my example above, disable the input before hiding the cell.

```

var cell = "5~14";

var input = jQuery(("#QR~"+this.questionId+"~"+cell).replace(/~/g, "\\\\~"));

input.prop("disabled",true);

input.closest("td").find("*").hide();

```
Hi there,

I have a similar quesiton regarding hiding the middle button of a bipolar scale. Although I have successfully managed to hide it some time ago, now, rather unexpectedly, it seems that it does not work. Any idea about how to solve the problem?

The JS code for a simple bipolar question with three options in which I am trying to hide the middle button is as follows:



Qualtrics.SurveyEngine.addOnload(function()

{

var cell = "1~2";

jQuery(("#QR~"+this.questionId+"~"+cell).replace(/~/g, "\\\\~")).closest("td").find("*").hide();

});



I thank you for your cosnideration.

Hey I came across this question related to something I’m working on. I’m representing a five-point satisfaction Likert item with emoji. I would like to make the emoji clickable (with a highlight indication  around the selected emoji showing the respondent they have selected that choice) and hide the radio button. Is this the way to do that? 

 

Also, a general question (for custom coding learners like myself): Where exactly do I put the accepted answer in my Qualtrics interface?


@AbeB,

Put the accepted answer in the question’s addOnload function.


Hi everyone,

If you actually want to remove the radio button (as opposed to hiding it), use the following code:

jQuery(("#QR~"+this.questionId+"~COL~ROW").replace(/~/g,"\\~")).closest("td").find("*").remove();

 

Place this line of code within the addOnload section.

Replace COL with the column number (1 for 1st column, 2 for 2nd column) of your table, and ROW with the row number.

Note: This is a single line of code, but appears to have been automatically split across two lines. Remove the line break if it appears.


Leave a Reply