Qualtrics Survey Design With JavaScript

By Kai Chang, Director, Office of Institutional Effectiveness, Bastyr University

JavaScript Support in Qualtrics

Qualtrics is a robust, web-based survey application that’s very popular among IR professionals. I’ve been using Qualtrics for over five years now and particularly enjoy the freedom to customize multiple aspects of my survey design. While the canned questionnaire will probably meet 90% of your needs, sometimes a little customization makes the user experience better. This Tech Tip introduces adding JavaScript to create fluid one-touch, click-through survey questions in Qualtrics. At the basic level, Qualtrics is nothing more than another web form – and traditional web forms can be tedious and click heavy. This tip aims to help eliminate the survey user’s need to click the ‘next’ button following each of their responses, thus enabling them to move through the survey more quickly.

 

How to Add JavaScript to Qualtrics

1. The first step is to create a Single Answer Multiple Choice question as shown below:

ttjuly20171.PNG

 

2. Next, click the gear box on the left of the question and select “Add JavaScript.”

ttjuly20172.PNG

3. In the JavaScript popup window, remove the default statement and replace it with the code in the next step.


ttjuly20173a.PNG

4. Copy and paste the JavaScript code below into the empty popup screen.

Qualtrics.SurveyEngine.addOnload(function()

{

var that = this;

this.hideNextButton();

this.questionclick = function(event,element){

if (element.type == 'radio') {

that.clickNextButton();

}

}

});

The key components in the code above are:

  • (this.hideNextButton()) – hides the Next button

  • (that.clickNextButton()) – automatically clicks the Next button after the user make a single selection

Note that this JavaScript code is only applicable for Single Answer Multiple Choice questions. However, with a different code, JavaScript can still be applied to other question types. If you ever need to remove JavaScript from your question, just click the “Clear” button.

ttjuly20174.PNG

5. When set up properly, you will not have any errors in the JavaScript popup, and a new icon with “JS” will appear on the left side of your single-choice radio question.

ttjuly20175.PNG

6. As you add more questions to your survey, make sure to add a page break to each question. Otherwise, any radio button that is clicked will cause the survey to proceed to the next page.

 

ttjuly20176.PNG

7. I recommend going to the “Suggestion: Add a Back Button” to your survey by going to Survey Options in the top toolbar. This is to protect respondents from selecting the wrong choice.

ttjuly20177.PNG

8. Finally, you can see the end result in the preview link.

Note: Repeat the steps above on each question for which you want to enable JavaScript. At this time, I am not aware of any other way to add JavaScript to all your questions at once.

Final Comments

Unfortunately, Qualtrics does not provide any additional support for JavaScript. Their official statement is:

“Warning: Custom coding features are provided as-is and may require programming knowledge to implement. Our support team does not offer assistance or consultation on custom coding. If you’d like to know more about our custom coding services, please contact your Qualtrics Account Executive.”

They do, however, provide a JavaScript API so interested parties can experiment with different methods. There are also additional resources available that you may want to review.

This type of one-touch, click-through design may not be appropriate for all surveys. Often, there is a level of cognitive demand expected from your respondents – you want to make them think a little before completing their choices. You may want to try randomizing your one-click question types or combining them with other question types.

Thank you in advance for your time and interest. I look forward to comments, feedback, and suggestions from the community.

 
 

 Comments

 
To add a comment, Sign In
Total Comments: 3
 
Andrew posted on 7/14/2017 8:44 AM
Great idea!
Mike posted on 7/21/2017 6:38 AM
A nice tip, thanks Kai!
Kim Horton posted on 9/4/2017 2:27 AM
htto://www.nice.com