As a part of my research. I am doing two conjoint studies. An example of one is shown below. I have to do it manually to have control over the choices created. I used the multiple choice option Qualtrics. I made the table in the question section and the Option are the multiple choice options.
My Question is:
Is there anyway I can create this table in Qualtrics and have the select buttons inside the table?
Currently these buttons are outside the question area as options of multiple choice, but I want to create it inside the table (so that a button “Purchase” would be inside the table) and when respondent clicks it, it records an answer.
Any help would be appreciated! I think some JavaScript is needed but I am not sure how to do it.
Thanks
Page 1 / 1
@OBh,
Since the choice labels have a for attribute, you can hide the question body and move the choice labels into your table. Make your choices vertical and give the cells in the last row of your table the class “lastRow”, then:
Qualtrics.SurveyEngine.addOnReady(function() { var q = jQuery(this.questionContainer); q.find(".QuestionBody").hide(); var labels = q.find("label.SingleAnswer").css("text-align","center"); q.find(".lastRow").each(function(i) { jQuery(this).append(labels(i]); }); });
Thank you for the response. ! I am having one trouble. In the data, it is all coming as “Purchase”. I need to have “Purchase” in all as my advisor told me to replace “Purchase Option X” with “Purchase” to make it realistic. So, is there anyway to record the choices distinctly in the data and analysis tab?
Additionally, it is possible to show the “Purchase” as buttons of some color? Currently the question is coming as follows:
It works for me, so I’m not sure what you are looking at. A simple test is to pipe the selected recode on the next page.
The for attribute links the label element to the input radio element, so that when the label is clicked the radio button is checked.
@TomG yes I was making an error in looking. So I edited my answer, because the choice is visible. Thanks for your response. Could you help me with the two small fixes?
Button: I was trying with the following code in the answer choices in the multiple choice answer. But now I am unable to click it to get a response.
<button id="myButton" >Purchase</button>
In Classic layout the label acts as a button, so you don’t need to add another one. If you are adding it for some other purpose, then stating the purpose may help me suggest an alternative.
No it is for the same purpose i.e., record a response. So my layout is “classic”. Something to make it look different and not the same skin color in the table. Make it come out.
/Also, any suggestion on how to differentiate choices in the data and analysis tab? They are all coming as “Purchase” ?]
It looks like below:
I was trying to make it look like a button. I tried the following but the buttons are just functioning like a picture.
You can use css to style the buttons. Include your table cell class (.lastRow) in the rule. For example:
To change how the choice appear in Data & Analysis, in the question editor select ‘Recode Values’, check ‘Variable naming’ and change them to whatever you want appear in Data & Analysis.
Thank you for your response. I tried your suggestion and it changed the color of the button. But it is still occupying the whole cell of the table. I wanted to create some while space around it, to make it look like a button. Something similar to the below.
Is that possible?
“To change how the choice appear in Data & Analysis, in the question editor select ‘Recode Values’, check ‘Variable naming’ and change them to whatever you want appear in Data & Analysis.” => This worked perfectly. Thank you so much.
Changing the background color was just an example. Using the same rule you can apply other styles, like: