How to change the separator for piped text | XM Community
Skip to main content
Here is one that I have solved, and will post a solution after the beta finishes out, but till then would love to see everyone's solutions!



When using piped text, how can I change commas (or some other arbitrary character / value) to something else (line breaks, dashes, other words, etc.).



As I said, I have a solution, but I would love to see what you all come up with in the mean time.
while we wait, can you share the use cases? You've got me curious about how you're thinking of the use for it? And how you're using it (not implementing)...
@MartyK

The most common use case I have seen is people wanting to display a list of selected options in a unique way. For instance instead of Dog, Cat, Bird, Fish; perhaps you want it to display as:



Dog

Cat

Bird

Fish



As for how to achieve this, first pip your text in to a div or span html tag with the class "CommaReplacement", for example:



`Your answers are: <div class='CommaReplacement'>${q://QID1/ChoiceGroup/SelectedChoices}</div>`



Then, add the following JavaScript to your questions JavaScript editor, updating the newDelimiter to your desired effect:



Qualtrics.SurveyEngine.addOnReady(function()

{

var textElements = this.questionContainer.select('.CommaReplacement');

var newDelimiter = "<br>"



for(var i = 0; i<textElements.length; i++){

var temp = textElements[i].innerHTML;

console.log(temp);

temp = temp.replace(new RegExp(", ", 'g'), newDelimiter);

console.log(temp);

textElements[i].innerHTML = temp;

}



});





This will also work with multiple "CommaReplacement" tags in the same question. However it will only affect the current question.



I have attached a QSF demo for this.
Hello, what should I do if I want to change only the commas in the piped text? I have attempted this method and it works only if I don't have other commas in the text. When I attempted to put the div around only the piped text, there is a space between the rest of the actual text. Please help me.
@Kai_Chizuru You can do exactly what you mentioned except instead of placing the piped text in a div, place it in a <span> using the same class name!
@AnthonyR - I tried your instructions for the e-mail trigger, however, I still get the horizontal list with the commas. Any ideas?

Hello,
Thanks so much for including this. It's working great for my survey. I have a question asking the user to select what they own among a long list of assets/debts. Then, on the follow-up question, I display all the assets/debts they indicated they own.
Is there a way to add a bullet in front of each of the selected options where I'm piping them?
So, in your example above, you would display:

  • Dog

  • Cat

  • Bird

  • Fish

Thanks!


Hello @Kai_Chizuru 
How did you solve this issue? I have the same problem, and I would like the comma to separate each option. For example: if a) dog,cat b) cat, dog
I want the result to be:
-dog, cat
-cat, dog


Leave a Reply