Unable to resize Form Field text boxes. | XM Community
Skip to main content

I have a Form Field item with 4 boxes to be filled in that have text before and after them. Ideally, I'd like the text entry boxes small enough that everything fits on one line, but no matter what I do the text entry boxes are stretched out to occupy a full line and the text that goes before/after is pushed onto new lines.
I have tried using the "Short" option in the Edit Validation view.
I have tried clicking and dragging the size of the boxes in the builder.
I have tried several HTML/Java/CSS plugins, but none of them have worked and I probably don't know enough to have plugged them into the right place.
I'm already running something in the Javascript view to add text after the boxes, so I'll post that here incase that's causing some sort of interference.

Qualtrics.SurveyEngine.addOnload(function()
{
var inputs = $(this.getQuestionContainer()).select('input[type="text"]');
var input = inputs[0];
$(input).insert({after: 'feet'});
var input = inputs[1];
$(input).insert({after: 'inches'});
var input = inputs[2];
$(input).insert({after: 'pounds'});
var input = inputs[3];
$(input).insert({after: 'inches'});
});

All this said, my programming experience is limited to R, so please be specific if you post code to fix things. I've seen a lot of posts that just have a line or two with 0 context, and I have no idea if any of it needs to be changed, or if it goes in the addOnload, addOnRead, or addOnUnload function, etc.

Hi there, if you still need, you should be able to put in place what you're describing by using a Matrix question type with 4 scale points and setting the Type to "Text entry" and the Text Box Size to "Short".
It will also be helpful to hide the first column of this Matrix table if you don't need it, which can be done by adding the below CSS over in the Style section of the survey's Look & Feel.
div.Inner.BorderColor.TE > div > fieldset > div > table > thead > tr > td {
display: none;
}

.Skin .Matrix table th.c1 {
display: none;
}
MatrixTextEntryFormFields.png


Leave a Reply