Identifying ID of response option | XM Community
Skip to main content

I have javascript that someone in the community provided me to help me hide question response options within a drill down question. I am not a coder but have done a fairly good job of reusing the code until now.

The first example is working. I want the student name visible and available for selection but I want the student email option to be hidden from view while the associated email address is still available in the background for use in the email trigger.

Question Code

 

Qualtrics.SurveyEngine.addOnReady(function()
{
    var qid = this.questionId;
var sel3 = document.getElementById('QR~'+qid+'~5');
var sel4 = document.getElementById('QR~'+qid+'~8');

jQuery(sel3).on('change', function() {
 sel4.optionst1].selected = true;
});

});

I am running into issues when it comes to identifying the code Qualtrics gives an option that is available to select (noted in yellow highlight below). I’m guessing my assumption that the options identified as sel1 and sel2 is incorrect, but I do not know how to find the correct identifier.

I have no problem identifying the item highlighted in green. I just use the piped text feature to find that identifier.

Question Code

 

Qualtrics.SurveyEngine.addOnReady(function()
{
    var qid = this.questionId;
var sel1 = document.getElementById('QR~'+qid+'~4');
var sel2 = document.getElementById('QR~'+qid+'~5');

jQuery(sel1).on('change', function() {
 sel2.optionsp1].selected = true;
});

});

 

Can anyone help me understand where my assumption goes awry in the second example which isn’t working and how to find the correct identifier? I’ve tried keeping var sel3 and var sel4 as is like in the working code but that didn’t work. I’ve tried redefining the var to var sel1 and var sel2 (as well as other permutations) but also no joy.

 

In the survey builder, you can Control + Shift + Click on ‘Tools’ to switch on ‘Support Mode’.
 

You now could / should be able to see the identifiers.

Thank you @ManfredBM . That is definitely easier than using piped text, but unfortunately still does not solve my problem.  Despite having the correct IDs, the code still won’t work in my new question.

If I understand code correctly, var sel3 and var sel4 could easily read var borg1 or var borg2 or var thing1 or var thing2. As long as I consistently call the variable the code should work. Thus, I’m confused as to why the code is not working in the second question while it is working in the first question.

Hi, correct the vars can be called anything. The part in green is what will select the elements on the page. When you are in Support mode and look at the drilldown question, what do you see for the numbers in the red boxes? These will be the choice Ids and should match the numbers in green.

You might also try creating a new drilldown question, set number of choices to 2, upload the 2 column csv, and add below JS to the OnReady section:

var qid = this.questionId;
var sel1 = document.getElementById('QR~'+qid+'~1');
var sel2 = document.getElementById('QR~'+qid+'~2');

jQuery(sel1).on('change', function() {
 sel2.options[1].selected = true;
});

and if you want to hide the email row from the respondent, add below CSS to the Style section of the Look & Feel, updating the QID for your drilldown question

#QID20 div.Inner.BorderColor.DL > div > fieldset > div > table > tbody > tr:nth-child(2) {
display: none !important;
}

 

Leave a Reply


Terms & Conditions