piped multi select answers, remove comma separators, add line breaks | XM Community
Skip to main content

I’ve searched the forums, but I haven’t quite found what I need, and I’m not experienced enough with Javascript to figure it out myself. What I want to do is take the response from a multi-select multiple choice question, and pipe the answer into an email that lives in the workflow. When I simply pipe it in as is, the items are all listed in a long string separated with commas. What I’d prefer, is to have them separated by HTML line breaks <br> so that they’ll display nicely in the email.

Here’s the code I currently have in the javascript setting of my multi-select question:

Qualtrics.SurveyEngine.addOnPageSubmit(function() 
{

var selChoice = this.getSelectedChoices();
var choiceRef = "";
var choiceComma = "";
var choiceText = "";
        for (let i = 0; i < selChoice.length; i++) {
            choiceRef = "#" + this.questionId + "-" + selChoice i] + "-label > span";
            choiceComma += document.querySelector(choiceRef).innerHTML + ", ";
		}

choiceText = choiceComma.replace(/,\s*$/, "");

Qualtrics.SurveyEngine.setEmbeddedData("choiceText",choiceText);

});

It gives me my embedded list, but I can’t figure out how to replace the commas with <br>.

Replace this:

choiceComma += document.querySelector(choiceRef).innerHTML + ", ";

with:

choiceComma += document.querySelector(choiceRef).innerHTML + "<br>";

 

Thanks, Tom! Follow-up question: my multi-select question has an option to select “other” and allows text entry for that selection. Can I include that text entry in this embedded data field if “other” is selected?

@TomG  - I’d like to tweak my code a little bit more. My multi-select question has an option to select “other” and enter a text response for that selection. Can I include that text entry in this embedded data field if “other” is selected? Like, instead of doing a list of the Selected Choices, change the code to do a list of the “Selected Choices - Entered Text” so that it includes everything? I tried just doing it like this in the email:

${e://Field/choiceText}${q://QID8/ChoiceTextEntryValue/8}

...but it creates an extra line break at the end when “other” isn’t selected.

I hope this makes sense.

UPDATE:

I think I might have figured it out. Here’s my new code with a slice added in to remove the extra characters in my HTML code. Would love it if somebody could look at it and let me know if I’ve done anything wrong or if it could be done better (because I sure don’t know lol).

Qualtrics.SurveyEngine.addOnPageSubmit(function() 
{

var selChoice = this.getSelectedChoices();
var choiceRef = "";
var choiceComma = "";
var choiceText = "";
        for (let i = 0; i < selChoice.length; i++) {
            choiceRef = "#" + this.questionId + "-" + selChoiceei] + "-label > span";
            choiceComma += document.querySelector(choiceRef).innerHTML + "</li><li>";
		}

choiceText = choiceComma.replace(/,\s*$/, "");

choiceText = choiceText.slice (0, -9);

Qualtrics.SurveyEngine.setEmbeddedData("choiceText",choiceText);

});

And then I have this HTML in my email:

<ul>
 <li>${e://Field/choiceText} ${q://QID8/ChoiceTextEntryValue/8}</li>
</ul>

It seems to work! 🤞

@Lauren_Hitchcock,

No offense, but it seems a bit kludgy. I think this is cleaner, supports allow text on any choices, and doesn’t require any additional html or piped fields:

Qualtrics.SurveyEngine.addOnPageSubmit(function() {
	var selected = =];
	jQuery("#"+this.questionId+" "choiceid]:checked").each(function() {
		var item = jQuery(this).closest(".Selection");
		var label = item.find(".LabelWrapper label>span").html();
		if(item.find(".InputText").length>0) label += " "+item.find(".InputText").val();
		selected.push("<li>"+label+"</li>");
	});
	Qualtrics.SurveyEngine.setEmbeddedData("choiceText","<ul>"+selected.join("")+"</ul>");
});

 

@Lauren_Hitchcock,

No offense, but it seems a bit kludgy. I think this is cleaner, supports allow text on any choices, and doesn’t require any additional html or piped fields:

Qualtrics.SurveyEngine.addOnPageSubmit(function() {
	var selected = =];
	jQuery("#"+this.questionId+" "choiceid]:checked").each(function() {
		var item = jQuery(this).closest(".Selection");
		var label = item.find(".LabelWrapper label>span").html();
		if(item.find(".InputText").length>0) label += " "+item.find(".InputText").val();
		selected.push("<li>"+label+"</li>");
	});
	Qualtrics.SurveyEngine.setEmbeddedData("choiceText","<ul>"+selected.join("")+"</ul>");
});

 

Thanks so much, Tom! And not even a little bit of offense taken. I knew there was probably a better way to do it. Thanks again!

Leave a Reply


Terms & Conditions