How to hide radio button in Side by Side Question | XM Community
Skip to main content
Question

How to hide radio button in Side by Side Question

  • September 26, 2024
  • 5 replies
  • 100 views

Forum|alt.badge.img+1

Hello Qualtrics Hive Mind!

I have a side-by-side question similar to the one below, and I want to hide the 'NA' radio button that's highlighted. I've searched the community pages and found a few JavaScript examples, but I haven't had any luck getting them to work.

The code I’m using is similar to what I've seen, but it's not working for me. Apologies if this is repetitive.

Any recommendations or suggestions would be greatly appreciated!

Qualtrics.SurveyEngine.addOnReady(function() {
var qid = this.questionId; // Get the question ID dynamically

// Target the radio button in row 1 (second row), column 2 (third column)
$('#QR~' + qid + '~1~2').closest('td').find('input[type="radio"]').hide();
});

Patrick

5 replies

Nam Nguyen
QPN Level 8 ●●●●●●●●
Forum|alt.badge.img+29
  • QPN Level 8 ●●●●●●●●
  • September 26, 2024

Hi @qpoint_24 , try this

Qualtrics.SurveyEngine.addOnload(function() {
var qid = this.questionId;

var radioButton = document.getElementById('QR~' + qid + '#2~4~1');

if (radioButton) {
radioButton.style.display = 'none';
}

var label = document.querySelector('label[for="QR~' + qid + '#2~4~1"]');
if (label) {
label.style.display = 'none';
}
});

Let me know if it worked


Forum|alt.badge.img+1
  • Author
  • September 26, 2024

Hi @qpoint_24 , try this

Qualtrics.SurveyEngine.addOnload(function() {
var qid = this.questionId;

var radioButton = document.getElementById('QR~' + qid + '#2~4~1');

if (radioButton) {
radioButton.style.display = 'none';
}

var label = document.querySelector('label[for="QR~' + qid + '#2~4~1"]');
if (label) {
label.style.display = 'none';
}
});

Let me know if it worked

Hi @Nam Nguyen ,

Thanks for the recommendation. However, when I tried this and ‘previewed’ the question, it doesn’t appear to be working, both radio buttons are still displayed.

I am using JS to hide a radio button in a matrix question in the same survey using:

jQuery(".ChoiceRow:eq(0) .last").hide();

The above works when applied to a matrix type question, not sure why i’m having issues when applying JS to a sidexside question.

I appreciate your help!

Patrick


Nam Nguyen
QPN Level 8 ●●●●●●●●
Forum|alt.badge.img+29
  • QPN Level 8 ●●●●●●●●
  • September 26, 2024

I am using JS to hide a radio button in a matrix question in the same survey using:

jQuery(".ChoiceRow:eq(0) .last").hide();

The above works when applied to a matrix type question, not sure why i’m having issues when applying JS to a sidexside question.

I appreciate your help!

Patrick

@qpoint_24 Matrix and SidebySide are 2 different type, you cant expect them to work on each other. In my example, I target the right one and it worked no matter if I change the set-up.

Do you have any other code that might interfere with this?


Forum|alt.badge.img+1
  • Author
  • September 26, 2024

Thanks, @Nam Nguyen

I updated the portions of your JS code below and it is now working!!
 


var radioButton = document.getElementById('QR~' + qid + '#2~1~1'); //updated from #2~4~1
var label = document.querySelector('label[for="QR~' + qid + '#2~1~1"]'); //updated from #2~4~1

 Thank you, you’re a life saver.


Nam Nguyen
QPN Level 8 ●●●●●●●●
Forum|alt.badge.img+29
  • QPN Level 8 ●●●●●●●●
  • September 26, 2024

Thanks, @Nam Nguyen

I updated the portions of your JS code below and it is now working!!
 


var radioButton = document.getElementById('QR~' + qid + '#2~1~1'); //updated from #2~4~1
var label = document.querySelector('label[for="QR~' + qid + '#2~1~1"]'); //updated from #2~4~1

 Thank you, you’re a life saver.

@qpoint_24 Glad to hear that 😍