Custom Code | XM Community

Custom Code

Discuss custom code (HTML, CSS, JavaScript, etc.) solutions, best practices, & more.

  • 7,048 Topics
  • 22,086 Replies

7048 Topics

B
bjorgenson
asked in Custom Code

How to get date range from flatpickr?

So I have flatpickr working in qualtrics with this code: ! And it returns a value of something like this: 2018-05-30 to 2018-05-31 I want to take the returned value split it at the " to " and then convert each of those values to epoch time so I can subtract them and find the number of days in the range. So far I have this: ! But I can't seem to get the slipt to work, most of the code was borrowed from another post, sorry my JS is not great.

1
TomG
Level 8 ●●●●●●●●
5 years ago
Dorota
Dorota
asked in Custom Code

Adding custom validation for sum of numerical text entry questions

Hi! I am working on setting the custom validation for the below questions: ! The purpose is to add logical validation like: 1. Domestic Executive Employee number should be lower or equal to Total Corporation Executive Employee number 2. Domestic Management Employee number should be lower or equal to Total Corporation Management Employee number 3. Domestic Other Professional Employee number should be lower or equal to Total Corporation Other Professional Employee number 4. Domestic Other Clerical Employee number should be lower or equal to Total Corporation Other Clerical Employee number 5. Sum of Domestic Employees given by level should be less or equal to Total Number for Domestic Employees given in the first question 6. Sum of Total Corporate Employees given by level should be less or equal to Total Number for Total Corporate Employees given in the first question Right now I am doing it using Custom validations, pipe texts and equations like this: $e{ QR~QID2~1~1~TEXT + QR

1
Samarth
Level 2 ●●
5 years ago
S
Stap
asked in Custom Code

VIdeo question - why does it not resize?

I'm using a video in one of my questionnaires but the Video does not automatically resize on mobile devices, but images do? Is there something I can do to make the video resize automatically?

4
S
5 years ago
L
lverbrug
asked in Custom Code

Is it possible to add a map interface in the survey, for example Google Maps?

In my survey, I would like to let respondents map certain points on a map, and have the GPS coordinates of these points as data output. Is this possible with Qualtrics? And if so, how?

8
Samarth
Level 2 ●●
5 years ago
A
ama_77
asked in Custom Code

Mountain theme - getting to the end of survey message

Hi, I am using the theme "Mountains" for a survey. At the last page of the survey, there is usually a "forward" arrow, which takes the respondent to the end of survey message. However, with this theme (or if it is something that I have done), I do not get this arrow. I would like to have the arrow so that respondents know that they have finished the survey. Does anyone know how to accomplish this?

3
Matt_Christie_Walker
QPN Level 3 ●●●
5 years ago
M
marean
asked in Custom Code

How to right-align labels in a form type question?

Does anyone know some Java script that would align labels on the right in a form? In other words, I'm trying to push the labels right up against the text box entry areas, so that the blank space between the label for the box and the box itself is eliminated as much as possible, like so: Name ___ ___ ___ Mailing Address ___ ___ ___ Thanks for any help you can provide!

5
TomG
Level 8 ●●●●●●●●
5 years ago
S
sheri.lowry
asked in Custom Code

Does anyone have TESTING SCRIPTS they can share?

I am looking to write basic testing scripts for testing the programming of a survey. I was hoping not to start from scratch and that someone else already has something they are willing to share.

1
TomG
Level 8 ●●●●●●●●
5 years ago
D
Level 1 ●
DRRTGCCLevel 1 ●
asked in Custom Code

Pick, Group, and Rank Box Heights

We have a question in a survey that asks respondents to rank 20 different items, but we need the particular functionality/ look of the question to be a drag and drop specifically (not the Rank Order type though, as we need them to drag into different amounts of a money allocation), so the Pick, Group, and Rank question makes the most sense, using 20 groups. But the box for each of those groups for that type of question is too big, whereas we only need (and in fact, require) just one item per group. This is not only inconvenient but also makes answering the question virtually impossible, since the screen does not scroll down when one tries to drag an item down to a group far down the page. Is there a way to adjust the height of these group boxes, so that they only fit one item in each (or at the very least are "shorter")? Alternatively, if there's some other type of question or way to do this, any help would be greatly appreciated! The drag-and-drop functionality is non-negotiable I'm

2
D
Level 1 ●
5 years ago
E
EmilyG
asked in Custom Code

Removing Next Button and having the answers as next button

I want to remove the next button and replace it with the answers as the next button instead. Essentially, when a customer answers the survey on our website, they'll only need to click on the answers instead of clicking the answer and next button to bring you to the next question. I've tried hiding the next button on Advanced CSS but the answers won't be captured due to disabling the next button. I've also tried the javascript below but i didn't want my customers who are answering the questions to be waiting for 5 seconds for every single answer. Qualtrics.SurveyEngine.addOnReady(function() { var that = this; var allowedTime = 5 //Set this to the time allowed on page setTimeout(function(){ console.log('Now!!'); that.clickNextButton(); }, allowedTime * 1000 ); }); Can someone help me? I don't have any Javascript background and have called the support team in Qualtrics but no one have got a solution to it.

1
U
Level 3 ●●●
5 years ago
K
Karim
posted in Custom Code

HASHING and transferring from one survey to another and back

Hi, Is there a way to HASH embedded data? I'm trying to move from one survey to another with data that is HASHED in the URL and then come back and continue the survey I started? Thanks

0
K
5 years ago
S
Sludemann
asked in Custom Code

What CSS custom code can I use to hide the scrollbar that appears within my survey?

!

4
S
5 years ago
T
tarantino
asked in Custom Code

Fill leftmost column of a matrix table text entry question with piped text and make read-only?

I have a matrix table text entry question with 7 statements and 2 scale points. I want the leftmost column of text entry boxes to be filled with the piped text from a previous question, and to be made read-only so that the text cannot be edited. Each text box starting at the top, and ending at the bottom of the column, should be filled with piped text (response) from an earlier question. Is this possible with Javascript?

2
T
5 years ago
E
ethz
asked in Custom Code

Custom question field with compass pointer

I'm trying to create a new question as indicated below in the image. ! Is there a way for me to recreate this in javascript? I'm familiar with programming, but unfamiliar with html/css/javascript, so I've tried messing with the Qualtrics API using the Qualtrics.SurveyEngine.addOnload function etc but it's beyond my knowledge. Also, if possible, can the compass wheel in the centre instead be controlled by touch/mouse to be a arrow pointing in a specific direction? Thanks in advance!

3
E
5 years ago
P
pmeyermuc
asked in Custom Code

Add text before / after a textbox

I've used the following Javascript to add custom text before or after a input textbox in an answer so far: Qualtrics.SurveyEngine.addOnload(function() { var inputs = $(this.getQuestionContainer()).select('input[type="text"]'); for (var i = 0; i < inputs.length; i++) { var input = inputs[i]; $(input).insert({before: 'text'}); $(input).insert({after: 'text'}); } }); Now it seems that is not longer working :-( Has anybody an idea how it could be working now? I'm not really a Javascript-crack...

1
Rich_Boits_Walker
QPN Level 3 ●●●
5 years ago
S
SamK
asked in Custom Code

How to change the background color for multiple choices on "Minimal 3d green" theme

I am trying to change the background color for multiple choices but it is changing only for 2 options and not for all the options. Also the color kinda goes out of the border for the options it is working for. Below is the code and screen shot: li{ background-color:#F1F1F1; color:#63666A; }!

1
Rich_Boits_Walker
QPN Level 3 ●●●
5 years ago
U
Level 3 ●●●
uhrxx005Level 3 ●●●
asked in Custom Code

Can you set default choice on text entry boxes that disappear when participants click in the box?

I would like to set a default response for a text entry question to demonstrate the format the text should be in, but I would like the default text to disappear when the respondent clicks on the box. Is this possible? Thank you in advance for your help!

1
TomG
Level 8 ●●●●●●●●
5 years ago
L
Level 1 ●
lejoshuaLevel 1 ●
asked in Custom Code

Hiding the "next" button until a key combination is typed a certain number of times

Hello! I had some JavaScript which used to work for hiding the next button until a survey taker had typed "a" then "b" 100 times - but within the last few weeks the code appears to have stopped working. I attach the code as a text file. In addition, here is a link to the survey with the relevant question in: login.qualtrics.com/jfe/preview/SV_d4MYJ8FTOzV44qV?Q_SurveyVersionID=current&Q_CHL=preview If you skip to the fifth page of the survey, then you will see the page where you have to type "ab" 100 times - but at the moment, the next button is showing from the start. In case it helps, to get this javascript code actually count up the amount of "ab"s that are typed, I added an authenticator to the end of the survey, and some embedded datafields at the beginning. ! ! Finally, assuming we can get the code working again, I wondered if it would be possible to set the number of "ab"s required to get the next button to show set by an embedded datafield. At the moment, I haven't bee

4
L
Level 1 ●
5 years ago
M
Merina
asked in Custom Code

How to make radio button multiple choice have "Next" button skin

Hey, I have a multiple choice question and instead of having radio buttons to click on I want the answer choices to have the same look as the "Next" button in my survey (which I have already customized to look how I want). I have Javascript set up on the page right now so that when they click the answer choice, it immediately takes them to the next page, so this would just be making it look more pleasing. I have a good amount of page customization, so I don't want to change the Theme to one with box questions. Any ideas?

1
MohammedAli_Rajapkar
QPN Level 5 ●●●●●
5 years ago
J
Janet
asked in Custom Code

Qualtrics calendar & date questions: I do not want to show 1900 to 2049 as possible dates.

Previously we could just delete the years not wanted. Now instructions say to change "yearFirst" and "yearLast" in the underlying javascript. I have done so ("yearFirst = 1957" and "yearLast=1997" but the question does not seem to even read the code and remains showing 1900 to 2049 (which is not even sensicle for a real survey question).

2
J
5 years ago
M
miga12
asked in Custom Code

How do I use a part of the answer of a previous question as an answer in a following question?

So my first question is: Whats your name? Then in a following question I want to ask: In which stock would you invest? An I want to give the 5 choices of stocknames, 4 fixed names and one that starts with the first three letters of the name they entered in the first question, followed by -ment. So my name is MICHAEL, thus there should be one stock named 'MICMENT' in the second question. Please help me out!

10
MohammedAli_Rajapkar
QPN Level 5 ●●●●●
5 years ago
S
SamK
asked in Custom Code

How to change the color of the button on hover? The below code is not working

.Skin #Buttons #NextButton:hover{ background-color:pink; color-blue; }

4
Matt_Christie_Walker
QPN Level 3 ●●●
5 years ago
Piotr
Piotr
asked in Custom Code

Can i add a display logic to header using javascript?

Hi, I was wondering if there is any way I can hide header in some part of the questionnaire using java script or other functionality? I am talking about the look and feel header. I would like this header to be displayed for example after some question or section. Would much appreciate any answer or clue. Thanks!

3
TomG
Level 8 ●●●●●●●●
6 years ago
S
SamK
asked in Custom Code

When clicked on one of the options on multi select how do I change the color? I

I tried the below code, but it works at moment of mouse click but the color goes away after the click li:active{ background-color: #930FA5 !important; color:#FFFFFF; } li:active{ background-color: #930FA5 !important; color:#FFFFFF; }

2
S
6 years ago
R
Rahul
asked in Custom Code

Can I give my survey a website kind of a look?

I would like to design my survey in a way that the section names are displayed on header as tabs (just like any website). Is it possible to accomplish?

2
R
6 years ago
M
MikeSmi
asked in Custom Code

Using javascript and loop-and-merge to populate a choice in a multiple choice question

I have a two-alternative multiple choice question whose alternatives are labelled "1" and "2". I'd like to use a loop-and-merge field that contains values 1 and 2 to determine whether "1" is chosen or "2" is chosen when the question is displayed. However, the code below throws an "unexpected {" error: Qualtrics.SurveyEngine.addOnload(function() { var questionId = this.questionId; questionID.setChoiceValue(${lm://Field/9}, true); }); And even this code (where I've simply tried to get "1" to be chosen) doesn't work: Qualtrics.SurveyEngine.addOnload(function() { var questionId = this.questionId; questionID.setChoiceValue(1, true); }); I'd be grateful for any help on this. --Cheers, Mike

3
M
6 years ago

Productivity playlist

Terms & Conditions