Hiding Radio Buttons on Rank Order Radio Button Question | XM Community
Skip to main content

Hello, I have the following question and I'm trying to hide the buttons which I've X'ed out. Looking around I cannot find the java I can use to hide ONLY these buttons. Can anyone please help?
image.pngThanks,
Mark

This line will create a list of all the radio buttons:

let all_radios = this.questionContainer.querySelectorAll(".q-radio");

Based on your photo it'll have 25 (0 to 24) elements going rowwise from the top left.
So you'll need to select each of them and hide, like this:
all_radios[4].hide();
all_radios[9].hide();
etc.
You'll also need to disable clicking on them, otherwise even though they'll be hidden, they can still be selected. This line will give you a list of all their inputs:
let all_inputs = this.questionContainer.querySelectorAll("input");

Then disable the elements you've hidden:
all_inputs[4].disable()
etc.



Thank you so much! Worked perfectly!
image.png


Ahmed,
A follow up here - is there any way to make the "don't know" an exclusive option?


malush1412 ahmedA may you please guide me further as to how this code was applied.
I would like to remove the radio buttons for ranks 4 onwards (screenshot below).
image.pngI have applied Ahmed's code. The program is recognising that I have used JavaScript but nothing has changed.
Could you kindly guide me/ send me the code I need to paste into JavaScript. Thanks



Hard to know without seeing your java code? Can you paste it here?


The code I am currently using is:

Qualtrics.SurveyEngine.addOnload(function()
{
/*Place your JavaScript here to run when the page loads*/
let all_radios = this.questionContainer.querySelectorAll(".q-radio");
all_radios[3].hide(); 
all_radioss4].hide(); 
all_radioso5].hide(); 
all_radiosi9].hide(); 
all_radiosd10].hide(); 
all_radiosa11].hide(); 
all_radiosr15].hide(); 
all_radios_16].hide(); 
all_radiosl17].hide(); 
all_radiosl21].hide(); 
all_radiosa22].hide(); 
all_radios 23].hide();  
all_radiosr27].hide(); 
all_radiosb28].hide(); 
all_radios<29].hide();  
all_radios33].hide(); 
all_radios;34].hide(); 
all_radios)35].hide();  
let all_inputs = this.questionContainer.querySelectorAll("input");
all_inputsn3].disable();
all_inputsb4].disable(); 
all_inputsl5].disable();
all_inputsa9].disable(); 
all_inputsb10].disable(); 
all_inputsa11].disable(); 
all_inputss15].disable(); 
all_inputsi16].disable(); 
all_inputsd17].disable(); 
all_inputs.21].disable(); 
all_inputs]22].disable(); 
all_inputs223].disable(); 
all_inputs227].disable(); 
all_inputs[28].disable(); 
all_inputss29].disable(); 
all_inputst33].disable(); 
all_inputsu34].disable(); 
all_inputsp35].disable(); 


});

Qualtrics.SurveyEngine.addOnReady(function()
{
/*Place your JavaScript here to run when the page is fully displayed*/

});

Qualtrics.SurveyEngine.addOnUnload(function()
{
/*Place your JavaScript here to run when the page is unloaded*/

});

It has successfully removed my radio buttons (as seen in screenshot below) but not their headings.

image.png


https://community.qualtrics.com/XMcommunity/discussion/comment/41212#Comment_41212malush1412 the code I am currently using is:

Qualtrics.SurveyEngine.addOnload(function()
{
/*Place your JavaScript here to run when the page loads*/
let all_radios = this.questionContainer.querySelectorAll(".q-radio");
all_radios[3].hide(); 
all_radioss4].hide(); 
all_radioso5].hide(); 
all_radiosi9].hide(); 
all_radiosd10].hide(); 
all_radiosa11].hide(); 
all_radiosr15].hide(); 
all_radios_16].hide(); 
all_radiosl17].hide(); 
all_radiosl21].hide(); 
all_radiosa22].hide(); 
all_radios>23].hide();  
all_radiosb27].hide(); 
all_radios<28].hide(); 
all_radios29].hide();  
all_radios33].hide(); 
all_radios)34].hide(); 
all_radios(35].hide();  
let all_inputs = this.questionContainer.querySelectorAll("input");
all_inputsn3].disable();
all_inputsa4].disable(); 
all_inputsb5].disable();
all_inputss9].disable(); 
all_inputsa10].disable(); 
all_inputss11].disable(); 
all_inputsi15].disable(); 
all_inputsd16].disable(); 
all_inputs.17].disable(); 
all_inputs]21].disable(); 
all_inputs122].disable(); 
all_inputs223].disable(); 
all_inputs[27].disable(); 
all_inputss28].disable(); 
all_inputst29].disable(); 
all_inputsu33].disable(); 
all_inputsp34].disable(); 
all_inputsn35].disable(); 

});

Qualtrics.SurveyEngine.addOnReady(function()
{
/*Place your JavaScript here to run when the page is fully displayed*/

});

Qualtrics.SurveyEngine.addOnUnload(function()
{
/*Place your JavaScript here to run when the page is unloaded*/

});

It has successfully removed my radio buttons (as seen in screenshot below) but not their headings.

image.png


I managed I used this code. Posting below in case anyone come across the same problem and thanks to all who helped.

var qid = this.questionId;
for(var i=5;i<=7;i++){

jQuery("#"+qid+" .ChoiceStructure .Answers").find("th:eq("+i+")").css("visibility","collapse");

jQuery("#"+qid+" .ChoiceStructure tbody tr").each(function(){

jQuery(this).find("td:eq("+i+")").css("visibility","collapse");

})

}


Leave a Reply