Help creating space between parts of the same question | XM Community
Solved

Help creating space between parts of the same question


Hi, so in one question of my survey there are 9 components that respondents are supposed to comment on. They're supposed to provide a brief answer for each of these 9 components. My questions are:

1) Is there any way, using custom code, to create more spacing between the nine options?
2) Is there any way, using custom code, to enlarge the boxes? I can enlarge in the editor but can't get that to ever show in the actual survey.

I've already chatted with Qualtrics Support and they said there's no way to automatically do this, so custom code is my only hope at this point.

Thank you so much!!









!
icon

Best answer by TomG 13 March 2019, 16:34

View original

12 replies

Userlevel 7
Badge +27
Martha,

Clicking on "Click here to edit form fields" then setting all the fields to "Essay" may address most of your issues.

To spread out the rows add top/bottom padding to the table cells:
```
Qualtrics.SurveyEngine.addOnload(function() {
jQuery("#"+this.questionId+" td").css("padding", "10px 0px");
});
```
Tom you're so great! This worked beautifully - thank you!!!
Userlevel 4
Badge +21
Code Copied and Saved. Thanks Tom.

@TomG - Perhaps you can answer a question that I have. I want to create a Census Form to collect a Customers Location and details, however if I had to design this I would want the following options:

!

City, State and Zip Code on one line.
- State would be a Drop Down

I know Qualtrics has a cool feature to pull City and State based on Zip Code, but I wanted to see if it is possible to position the Text Entry Form Fields can be positioned differently and if one Text Entry box could be a drop-down.

https://www.qualtrics.com/support/survey-platform/survey-module/editing-questions/validation/#ContentValidationZipCodes
Userlevel 7
Badge +27
> @GeorgeIssa said:
> Code Copied and Saved. Thanks Tom.
>
> @TomG - Perhaps you can answer a question that I have. I want to create a Census Form to collect a Customers Location and details, however if I had to design this I would want the following options:
>
> !
>
> City, State and Zip Code on one line.
> - State would be a Drop Down
>
> I know Qualtrics has a cool feature to pull City and State based on Zip Code, but I wanted to see if it is possible to position the Text Entry Form Fields can be positioned differently and if one Text Entry box could be a drop-down.
>
> https://www.qualtrics.com/support/survey-platform/survey-module/editing-questions/validation/#ContentValidationZipCodes

@GeorgeIssa,

Yes, you could do all of that with JavaScript, but it is fairly complicated.
Userlevel 4
Badge +21
Appreciate the response.
@TomG Hi Tom. I have a similar query as that of @mIS148, and used your solution and it was so helpful. My query is how can I increase the width of the labels?

!
!
Userlevel 7
Badge +27
> @SSETH said:
> @TomG Hi Tom. I have a similar query as that of @mIS148, and used your solution and it was so helpful. My query is how can I increase the width of the labels?
>
> !
Add a line like this to the JS to set the label width:
```
jQuery("#"+this.questionId+" td:not(.ControlContainer)").css("width", "50%");
```
@TomG Thanks Tom for this. I now need to change this question to a multiple choice with text entry fields. However, tyhe text entry fields are below the labels. Is there any way that I could shift the boxes to the right of the labels? Thanks.
Userlevel 7
Badge +27
Yes, there is. I'm fairly certain that topic has been covered before so you can search for it. If you don't find it start a new thread.
Badge
Hi there,
I have a similar question; I would like to customize the space between (eight) options either in a bipolar or a Likert type scale so that the four options to cluster close to each other on the left side and the remaining four options to do the same on the right side.
Something like the following:

Statement on the Statement on the
left side here right side here
4 3 2 1 1 2 3 4

I guess that it needs some customizing in CSS (in look and Feel, I think), but I do not know how. I will appreciate any help.

Hello TomG ,
I was wonder if I might follow up on this question. I've read a few other posts of yours, which have resolved most of my problems. I have one last issue, I have some questions with multiple sliders. I would like to give more padding between the sliders.
To give you some context, I have already insert your Java code pasted below to bring the labels closer to and under the slider for each slider. Now, I would just to spread each slider choice apart because now the labels sit on the choice text for slider below

Qualtrics.SurveyEngine.addOnReady(function()
{
var labels = jQuery("#"+this.questionId+" ul.labels");   
  labels.insertAfter("div.slider-container");
  labels.css('font-weight', '700');

jQuery("#"+this.questionId+" td.BarOuter").css("padding-bottom", "10px");
});

Leave a Reply