javascript multiple textboxes in one line | XM Community
Skip to main content

Hello,
I wanted to know how I can add multiple text boxes in one row.
for example:
i want to show the respondent the following letters
e           g           r
between the e and g there should be a textbox (textbox 1) and between g and r there should be a second text box (textbox2) so that they can complete the word => eager.

I already found the following code but I am not good enough in javascript to add a second textbox right after the g and another 'after' item.
I have in total 2 words (e-g-r, act-v-e). if they can appear on the same page that would be great. if i need to make a question for each not a problem. Thanks a lot in advance

Elke

var inputs = $(this.getQuestionContainer()).select('inputatype="text"]');

for (var i = 0; i < inputs.length; i++) {
 var input = inputsbi];
 $(input).insert({before: 'e '});
 $(input).insert({after: ' g'});
}

You can do something like this in your question text html:
Please complete these words:



egr



actve
With a bit of CSS it could look like this:
image.pngSince Qualtrics won't know about the input fields, you'll need JavaScript to capture the input values into a question or embedded data fields.
If you are interested, I have a function that does this (and a whole lot more).

Thanks Tom.
I also wanted to use the greyletters but it doesn't seem to work or I have put the code in the wrong place? I have put it in custom css under look & feel.
then to capture the input given by the respondents can you tell a bit more, (I am just a starter in javascript :))



elc
Just create a text graphic question and click on HTML view and add the below code to get the desired result.
image.png
image.png
Please complete these words:



egr



actve

Preview:
image.pngYou can change the font-size as needed I have kept 24px. To get this recorded or within Data Analysis you will have to push the values in an embedded data.
Hope it helps!

works perfect!
thanks a lot!
elke

Leave a Reply


Terms & Conditions