Answer is "unclicked" but will still be recorded as a selected answer in data output | XM Community
Skip to main content
Context: I'm using javascript (coded by someone else!) in one of my questions and it's currently doing the following:

1. It will pre-select/pre-code a choice if they selected recode value 1 OR 3 in a previous question (QID20, QID284, and QID283)and then the pre-selected choice will also be hidden on the page screen

2. Then, the respondent is shown any choice that was not pre-coded (QID15-16-label, QID15-17-label and/or QID15-18-label) AND the choice "none of these" which is exclusive BUT cannot be set to be exclusive on the survey question page because of the pre-coded answers. As such, the javacript on bottom is supposed to make "none" (QID15-19-label) exclusive by unclicking it IF an answer choice that is not pre-coded/hidden is selected



Question/Problem: Everything works fine when taking the survey/testing the survey. However, when I review the data, a choice will still be recorded if it was clicked and then unclicked. For example, if QID15-16-label is pre-coded and hidden and then I click on "none" (QID15-19-label) but then click on QID15-17-label -> QID15-19-label will be unclicked (doesn't have a check mark) and only QID15-17-label will be checked off BUT in the data output I see that the respondent's recorded answer for this question is QID15-16-label, QID15-17-label , and QID15-19-label... I should not be seeing QID15-19-label as a recorded value for this question... Looks like there should be some logic to also make sure that a de-selected choice is NOT recorded



(Please help :s )



CURRENT JAVASCRIPT:



Qualtrics.SurveyEngine.addOnload(function()

{

var choiceInputs = this.getChoices();

var job = ' '+'${q://QID20/SelectedChoicesRecode}'+',';

var studies = ' '+'${q://QID284/SelectedChoicesRecode}'+',';

var hobby = ' '+'${q://QID283/SelectedChoicesRecode}'+',';



if (job.indexOf(" 1,")!=-1 || job.indexOf(" 3,")!=-1){

this.setChoiceValue(choiceInputs[0], true);

choiceId = "16"; // Should find a way of doing this programatically

jQuery("#"+this.questionId+"-"+choiceId+"-label").hide()



}

if (studies.indexOf(" 1,")!=-1 || studies.indexOf(" 3,")!=-1){

this.setChoiceValue(choiceInputs[1], true);

choiceId = "17"; // Should find a way of doing this programatically

jQuery("#"+this.questionId+"-"+choiceId+"-label").hide()



}

if (hobby.indexOf(" 1,")!=-1 || hobby.indexOf(" 3,")!=-1){

this.setChoiceValue(choiceInputs[2], true);

choiceId = "18"; // Should find a way of doing this programatically

jQuery("#"+this.questionId+"-"+choiceId+"-label").hide()



}



var NONE_ID = '#QID15-19-label';

var JOB_ID = '#QID15-16-label';

var STUDY_ID = '#QID15-17-label';

var HOBBY_ID = '#QID15-18-label';



var click_handler = function(e) {

jQuery(NONE_ID).removeClass('q-checked');

}



jQuery(JOB_ID).on('click',click_handler);

jQuery(STUDY_ID).on('click',click_handler);

jQuery(HOBBY_ID).on('click',click_handler);



jQuery(NONE_ID).on('click', function(e) {

var that = this

if (!jQuery(this).hasClass('q-checked')) {

jQuery('li').each(function() {

let target = jQuery(this).find('label').length > 1 ? jQuery(this).find('label')[1] : jQuery(this).find('label')

if (target === that) {

return;

} else if (jQuery(target).is(':visible')) {

jQuery(target).removeClass('q-checked')

}



})

}

})



});
The code is removing the q-checked property from the label instead of changing the checked property of the input checkbox. Removing the q-checked class gives the appearance that the choice has been unselected, but it really hasn't. For example, if NONE_ID were the input checkbox instead of the none label, then to unselect it:

```

jQuery(NONE_ID).prop("checked", false);

```
Thank you for solving @TomG!! We were able to get it right now

Leave a Reply