How can I put a drop-down list in a form question field? | XM Community
Solved

How can I put a drop-down list in a form question field?

  • 26 September 2019
  • 44 replies
  • 4177 views

Userlevel 6
Badge +52
Hello Everybody!!
We need to launch a survey for updating customers´ data, so we need to make them to select which of the 3 types of document do they have, and this is just one of the field from the form and we don´t want to make an additional question for this.

I want to put the dropdown list in the yellow field:
!

Thanks for helping me!!! 😎 😎 😘 😘
icon

Best answer by uhrxx005 26 September 2019, 16:24

View original

44 replies

Userlevel 6
Badge +5
This QSF file should help you set it up.
Userlevel 6
Badge +52
Thanks so much David!!! That´s exactly what I needed!!!
SUPER GENIUS!! 😎 😎
Greetings from Colombia - Vocé!
Userlevel 7
Badge +27

If anyone is interested in a form dropdown solution that is much easier to implement and has much more functionality, see formSelects.

Hi, what do i do with the QSF file? Sorry, new to Qualtrics 🙂 I need to add a drop down list to a form question as well. please help!

Userlevel 5
Badge +11

https://www.qualtrics.com/community/discussion/comment/18149#Comment_18149Hi uhrxx005 thanks very much for the file. I've discovered a problem however in that when you have a validation on the page (it can be another question or the same), when the validation message appears, the page is refreshed (perhaps redrawn) but the selection is then lost in the field that you have the drop down associated with.

This pic shows that in your example file I've placed a validation on Field 2.
image.png I complete Field 3 using the drop down .
image.pngThe I click next
image.pngYou can see that the entry in Field 3 has disappeared.
Hope you can help with a fix. I've tried to work out if it's possible to check if the original text box is populated already and if so select the entry in the drop down but my javascript is not good enough to figure that out and also I'm wondering if that might cause some sort of circular reference.

Hope you can help

Thanks

Rod Pestell

Userlevel 1
Badge

This code works beautifully!
I am wondering if it is possible to combine this with some code for a default choice based on an embedded data field?
For example, the code below works for a a standard drop-down question:
Qualtrics.SurveyEngine.addOnReady(function()
{
/*Adds default to dropdown question choice based on embedded field*/
var select = jQuery("#"+this.questionId+" select");
if("${e://Field/track}" == "Alt 1") select.val("1");
if("${e://Field/track}" == "Alt 2") select.val("2");
if("${e://Field/track}" == "Alt 3") select.val("3");
if("${e://Field/track}" == "Alt 4") select.val("4");
if("${e://Field/track}" == "Alt 5") select.val("5");

});

Would there be a way to combine it with the code to add a dropdown to a form question? (I am adding the code shared in this thread below for convenience so people don't have to download and import the qsf file)
Qualtrics.SurveyEngine.addOnReady(function()
{
/*Creates dropdown lists for form text entry boxes*/
var that=this.questionId;
var element="";
  jQuery(element).insertAfter("#"+that+" .InputText:eq(2)");

  jQuery("#"+that+" .InputText:eq(2)").hide();
  jQuery("#"+that+" .InputText:eq(2)").val(jQuery("#s1 option:selected").text());

  jQuery("#s1").on('change',function(){
  jQuery("#"+that+" .InputText:eq(2)").val(jQuery("#s1 option:selected").text());
  });

});

Any help is much appreciated!

Never mind, figured it out! :)

Badge +9

dkennedy sorry, misread your question. The .InputText:eq(1) indicates the SECOND item on the form to have the dropdown; likewise the (2) indicates the THIRD item on the form. Be sure to also indicate with the S1 and S2 you see throughout the code, as well.

Badge +1

Thank you for the thread! This was most informative.

Userlevel 1
Badge +6

I created a form field that is using javascript from the community link below. It is working great when I tested it on the original question (meaning the options show up and I can select the right ones). I am re-using this question multiple times in the survey and so I just duplicated the question (which also worked great to display the response).
When I checked the response data I noticed that the additional questions are displaying what was recorded in the 1st question and not in the subsequent responses. (i.e. I select age of child 1 (1st question)=10, 2nd child (2nd question)=15. The fields generate the correct answers in the survey, but the response data in Data & Analysis only shows age=10 for both child 1 & 2.
These are all listed on the same page and expand from child 1 up to child 10 (depending on how many children the person selected in previous question)
I assume there is something I need to change for each question so that the response data, piped text, and future embedded data knows what was in the field of each question and doesn't reference the 1st response choices. I'm still a pretty new person to javascript, so any guidance would be appreciated. Thanks.

Userlevel 7
Badge +27

https://community.qualtrics.com/XMcommunity/discussion/comment/50630#Comment_50630Qualtrics.SurveyEngine.addOnload(function() {
jQuery("#"+this.questionId+" .InputText").css("border","none");
});

Badge

@jtherien , you can use side by side setup. but make survey side by side setup doesn’t support simple layout. You will need to change your survey layout from look and feel for this setup.

Can you give me some instruction?  I’m wondering if my institution doesn’t have a full license because I can’t see anything in Look and Feel to make these changes.

Badge +1

QSF file seems to be gone.

Badge

Thanks.  Unfortunately my layout option is grayed out so I assume we don’t have a full software license.  

Badge

Thanks.  So apparently it has to do with a static theme.  I need to create a dynamic theme.  So for now, I just switched it to a blank dynamic theme.  However, after I change the layout to something else (not simple), there is absolutely nothing different in order for me to make a more complicated matrix question.  *Sigh*  Thanks for all of the assistance today.  Just trying to make something more streamlined but making myself crazy in the process.  

Userlevel 7
Badge +20

Hello @uhrxx005, would you please be able to re-upload this QSF as a zip file for all new users who view this post? 🙂

@matthewlegge @jtherien, it seems that this file has been removed. Let’s hope the user is willing and able to re-upload the file as a zip file for you to download.

Userlevel 7
Badge +27

@Joris_D  - I have a function, formSelects, that supports default choices. It is also much more flexible and robust that the code posted on this thread.  If interested, you can contact me by private message.

Badge +2

This QSF file should help you set it up.

It’s possible I’m missing something because I’m new to the community side of Qualtrics, but where is the QSF file linked?  

Badge

This QSF file should help you set it up.

It’s possible I’m missing something because I’m new to the community side of Qualtrics, but where is the QSF file linked?  

Phew.  I thought it was me.  I couldn’t find it either.

Badge

This QSF file should help you set it up.

where can i find the QSF? 

Hey both,

just found this thread here, superhelpfull! So thanks also from my side 🙂 @uhrxx005: any chance you can also help me with this one? The width of the dropdown box is now smaller than the other ones. Do you know nhow i can adjust/ align the width of all answer boxes (incl. the drop-down) so that they're all the same widht (let's say 200 ptx :))?

Thanks,
Johannes

Great solution! I adapted this code to fit a use case that uses a constant sum w/total.
I was wondering if there is a way to retain the user's choice after a validation error message is presented?
For ex: There are 2 boxes and a total field, the validation is set such that the total must be equal to a 100.
If box 1 equals 50, box 2 equals 10, the validation fails and the user's choices are reset to null. Is there a way to retain their choices if the validation fails?

Userlevel 4
Badge +10

Thanks for providing the QSF file uhrxx005. Super helpful. Quick follow-up question. What part of the code do you modify to change which response option has the dropdown menu? I'm not a coder and am having a little trouble identifying the change required.

Badge +9

I have a follow up on this - it seems that once the page containing the form/drop down question is submitted, the selection disappears. If using a back button, or even on a summary page at the end of the survey, these lines are blank. How do I keep them without using embedded data? (i.e. it needs to populate on the summary page)

Badge +9

https://www.qualtrics.com/community/discussion/comment/26473#Comment_26473dkennedy this is code I'm using; the highlighted portions are where the drop down options are declared.
image.png

Leave a Reply