The eqVas function and associated html/css provide an EQ-VAS (Visual Analog Scale) that is part of an EQ-5D survey. Here is a quick video demonstration:
This function is available for a reasonable fee. Contact TomG on the Qualtrics Community to learn more.
Begin by importing the provided EQ-VAS .qsf into Qualtrics as follows:
Create new project → Survey → From a File → Choose file
If copying the EQ-VAS question to another survey follow the instructions below.
The question uses a stylesheet and JavaScript loaded in the survey header. If you copy the question to another survey, you need to add the following to the survey header. Go to Look & Feel → General → Header edit → and paste:
<link href="https://cdn.jsdelivr.net/npm/nouislider@14/distribute/nouislider.min.css" rel="stylesheet" /> <script src="https://cdn.jsdelivr.net/combine/npm/nouislider@14,npm/wnumb@1"></script>
Add the padTopHide embedded data field to the top of the survey flow. It prevents the question from being momentarily seen by the respondent before it is completely formatted by the JavaScript. Set padTopHide as follows:
padTopHide = padding-top:2500px;
The EQ-VAS question is self-contained. The easiest way to copy it to another survey is to add a question to the other survey (type doesn't matter), then: Change Question Type → Question Library → My Surveys → (pick the EQ-VAS survey and question) → Import
Custom Validation is used to require a response. If you copy the question to another survey, you'll need to update the Custom Validation to point to the current question. It should look like the following where Q1 is the EQ-VAS question:
To customize question text, click on the question, then click the HTML View tab in the upper right. DON'T change any of the html tags (anything between < and >) or any of the css (between <style> and </style> at the bottom)
To override the default options, specify the desired options in the second function argument as an object. For example:
Qualtrics.SurveyEngine.addOnload(function() {
eqVas(this,{handleHide:false,handleStart:0});
});
By default to vertical slider handle is hidden to start. To make the handle visible set handleHide to false:
hideHandle:false.
Default: true
handleStart specifies the starting position of the handle.
Default: 50