Not able to reset selected radio buttons using javascript | XM Community
Skip to main content
I have a survey question 'jQuery example' that sets the radio button of another question 'Autoselected from the last question' (screenshot of the form shown below):

!



The javascript to select the radio button works fine and looks like this:



jQuery( "input[name='QR\\~QID2']:nth(0)" ).prop('checked', true); // auto-selects the 'Yes' option in the 'Autoselected from the last question' question.



However I have tried every combination I can think of when trying to deselect the radio button in the next question 'Reset previous question response' (using the click event on this question). I have tried:





jQuery( "input[name='QR\\~QID2']" ).prop('checked', false); // does not work

jQuery( "input[name='QR\\~QID2']" ).attr('checked', false); // does not work

jQuery( "input[name='QR\\~QID2']" ).checked = false; // does not work

jQuery( "input[name='QR\\~QID2']:nth(0)" ).prop('checked', false); // does not work





Is this because of the way the radio buttons are built in Qualtrics (since they do not simply use the standard input field to display the buttons; there is a label element that seems to handle the display end)?



The Qualtrics.SurveyEngine API seems out of the question since I am trying to control an element/question that is not the one I am selecting (eg. I am using the click event of the third question to reset the selection of the second question).
> @"w.patrick.gale" said:

> Is this because of the way the radio buttons are built in Qualtrics (since they do not simply use the standard input field to display the buttons; there is a label element that seems to handle the display end)?



Yes, specifically it is the way they do it in JFE. The way you tried works in SE. There is a way to reset them in JFE by finding and changing the correct values in the question object (this), but it is complicated.
> @TomG said: but it is complicated.



I don't mind complicated so much, I would simply like to be able to make it work. Does the solution require raw javascript or is jQuery able to do the job?
You'll need to use both.
> @TomG said: You'll need to use both.



So I'm assuming it involves parsing out the labels associated with the radio buttons and changing the inline styles on the input label class from <label class='q-radio q-checked' ... AND the label wrapper inline class from <label class='SingleAnswer q-checked' ... to

<label class='q-radio' ... AND <label class='SingleAnswer' ...



I am hoping there is a better way.
Since the radio button groups were giving me so much trouble I switched to using a dropdown list and I was able to work with that. So to select the first item in a dropdown list using jQuery you would use something like:



jQuery( "select[name='QR\\~QID2']" ).val(1); // where val(1) is the first value in the dropdown list, val(2) would be the second, etc.



...and to reset to the empty/null value simply change the 'value' in the above line to:



jQuery( "select[name='QR\\~QID2']" ).val(0); // .val(-1) also seemed to work the same way

Leave a Reply