Question type "Text input" show multiple blocks on demand without set number | XM Community
Skip to main content
Question

Question type "Text input" show multiple blocks on demand without set number

  • October 18, 2023
  • 3 replies
  • 44 views

Forum|alt.badge.img+1

Hello all,

I would like to create a survey in which the participants describe ways of dealing with a topic. There can be different numbers of answers. Therefore I would like to have the option that the participants have more free text fields available, if they need them. This means that they are not shown a fixed number in advance, but as many as they need. For example, via a plus sign, so that they can make further text entries if they want to. Is there the possibility to do that? Unfortunately I have not found a solution yet. Maybe someone has an idea :)

Thank you very much!

Ann-Kathrin

 

3 replies

Shashi
Level 8 ●●●●●●●●
Forum|alt.badge.img+34
  • Level 8 ●●●●●●●●
  • 654 replies
  • October 18, 2023

We can provide some max form fields like ‘~50’ and then use this code to show plus button to add new text boxes.


Forum|alt.badge.img+1
  • Author
  • 1 reply
  • October 18, 2023

Thank you very much for the quick reply. How can I create the code to create the plus button? How can I practically implement your suggestion?  :)

Thanks!

Ann-Kathrin


Shashi
Level 8 ●●●●●●●●
Forum|alt.badge.img+34
  • Level 8 ●●●●●●●●
  • 654 replies
  • October 18, 2023

Create a form field question with let’s say 15 statements and add below JS in the JS of this question. preview and check the result.

Qualtrics.SurveyEngine.addOnReady(function() {
var that = this.questionId;
jQuery("#" + this.questionId + " .ChoiceStructure table tr:not(:lt(3))").hide();
jQuery("<input type='button' id='add' value='&plus;' name='+' />").insertAfter("#" + this.questionId + " .ChoiceStructure table tr:last");
jQuery("#add").on('click', function() {
var c = jQuery("#" + that + " .ChoiceStructure table tr:visible").length;
jQuery("#" + that + " .ChoiceStructure table tr:eq(" + c + ")").show();
});
});