How do I multi-select the choices in drilldown list?

Hi @JLPY ,

You can use select box instead.

Multiple selecting is not recommended though in drop down.

Thanks,

JB

Thanks Jagdish! however, the reason why I tend to use drilldown is because that, in drilldown, i can narrow down the choices in third dropdown based on what the user selects in first/second dropdowns. is it possible to do it in Select Box? thanks!

Hi JLPY,

Nope there is no direct option in Qualtrics. I would recommend splitting the last question to separate question and control the logic for each option in multi select question. In drop down, participants dont select multiple choices and there is no easy implementation as well. 

Thanks,

JB

You should use Select box question format for (multi select list). Put all the options on that list and hide Question via JS. and based of selection of drilldown first and second dropdown list, you can show list option on Select box using JS. That’s the only way you can achieve this. Else you will need to create separate Select box or multiselect question for 3rd drilldown list on next page. Dropdown has single select property, you can use it as multi select list.

Another option that I think comes close to what you are looking for would be to use select2 to turn the 3rd drilldown row into a multiple select. The selections would then be saved to an Embedded Data field which you could use later in the survey.

To give it a try, first add the below to the survey's Header over in the Look & Feel:

<script src="https://cdn.jsdelivr.net/npm/select2@4.0.12/dist/js/select2.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/select2@4.0.12/dist/css/select2.min.css" rel="stylesheet" />

Still in the Look & Feel, add the below CSS to the Style section:

.select2-container {
 width: 150px !important;
}

Over in the Survey Flow, create the Embedded Data fields of "selectionstext" and "selectionsvalue" and put them at the top of the Survey Flow.

Over in the Builder, create a Drilldown question and add the below to the question's JavaScript:

Qualtrics.SurveyEngine.addOnload(function()
{
	/*Place your JavaScript here to run when the page loads*/

});

Qualtrics.SurveyEngine.addOnReady(function()
{

	/*Place your JavaScript here to run when the page is fully displayed*/

//Add Select2 to 3rd drilldown row//
jQuery("#"+this.questionId).find('select').eq(2).select2({
closeOnSelect: false,
multiple: true,
placeholder: "Select"
});	

//Remove automatic blank selection//
jQuery("#"+this.questionId).find('select').on('change', function() {
jQuery(".select2-selection__rendered").find("li").eq(0).remove();
});


});

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

});

Qualtrics.SurveyEngine.addOnPageSubmit(function()
{

//Save values to Embedded Data on page submit//
var selectionsvalue = jQuery("#"+this.questionId).find('select').eq(2).val();
selectionsvalue = selectionsvalue.slice(1);
Qualtrics.SurveyEngine.setEmbeddedData("selectionsvalue",selectionsvalue);

var selectionstext = [];
if (jQuery("#"+this.questionId).find('select').eq(2).select2('data').length){
  jQuery.each(jQuery("#"+this.questionId).find('select').eq(2).select2('data'), function(key, item){
    selectionstext.push(item.text);
  });
}
selectionstext = selectionstext.slice(1);
Qualtrics.SurveyEngine.setEmbeddedData("selectionstext",selectionstext);

});

The embedded data does not get saved for me. Also, how do I get the selections from the multiselect dropdown into the correct question column of the Data & Analysis table?

Qualtrics also doesn’t like the question being required.