Developer Corner | XM Community

Developer Corner

Discuss developer and custom (HTML, CSS, Javascript) solutions, best practices, & more

8900 Topics

Y
yinbar
asked in Custom Code

How to hide the next button until a video embedded from Google Drive is finished?

I'm trying to use mp4 videos in my survey and have encountered some problems - I first tried to add them to the library (and had a great help in: https://www.qualtrics.com/community/discussion/6852/how-to-show-next-button-only-after-a-video-inserted-as-media-file-is-finished-playing). Then I realized that some of my videos are too big and Qualtrics allows for 16mb files only, so I decided to embed them from my Google Drive. However - I do not know how to solve the problem now - I want the next button to be hidden until the video finished playing. I'm not sure what is the player used by Google Drive - it seems very similar to YouTube but I can't tell. Moreover, when I tried to solution suggested in: https://www.qualtrics.com/community/discussion/1186/using-iframe-api-to-automatically-advance-to-next-page-after-a-video-has-been-watched nothing happened.... Any adice on how to do it with Google Drive, or any other way to include big video files on a survey (that does not involve uploadin

3
P
5 days ago
N
Level 2 ●●
nonufrieLevel 2 ●●
asked in Custom Code

input texts all set to be 'short' but come different size?

I can’t figure out why my form fields are not all equal size? They all set to be ‘short’. but for some reason, when I ‘inspect’, I see that some inputs are created with inline css style=”width: 60px”, and it seems to be totally random! I don’t have any custom JS for the sizes<input autocomplete="off" class="Short InputText QR-QID21-10 QWatchTimer" id="QR~QID21~10" name="QR~QID21~10~TEXT" style="width:60px;" type="text" value="" data-runtime-textvalue="runtime.Choices.10.Text" aria-labelledby="QR~QID21~10~label"><input autocomplete="off" class="Short InputText QR-QID21-11 QWatchTimer" id="QR~QID21~11" name="QR~QID21~11~TEXT" type="text" value="" data-runtime-textvalue="runtime.Choices.11.Text" aria-labelledby="QR~QID21~11~label"> 

4
K
5 days ago
H
HayleyH
asked in Custom Code

Calendar with date in DD/MM/YYYY format

Hello,I am attempting to use a calendar date box, I have inserted using import from library -> demographics ->calendar and date questions -> enter a date. My only problem is this comes out in US date format MM/DD/YYYY and I need it to be in UK DD/MM/YYYY format. Any suggestions on how to make this happen?Happy to try flatpicker, but it has not worked for me yet. I have tried the below.I tried adding into look and feel header: Help 😥

13
P
Level 1 ●
6 days ago
D
Level 1 ●
djuniusLevel 1 ●
asked in Custom Code

Vertical labels in matrix table

We have a matrix table with a lot of labels on the top axis. Wondering if anyone out there knows the html to change the labels to vertical like you can do in Excel and in the image below. It would be much easier on the user so they wouldn’t have to scroll to the right to see the other options. Thank you.   

10
L
Level 2 ●●
7 days ago
R
Level 1 ●
rarcegaLevel 1 ●
asked in Qualtrics API

How to grab a field from opted out contacts in the directory?

Is there a way I can automatically schedule (e.g. daily) a way to extract a specific embedded data field from contacts who opted out and either send this list to an ftp site or email it?  

0
R
Level 1 ●
8 days ago
VictorAV
Level 3 ●●●
VictorAVLevel 3 ●●●
asked in Integrations

How to match questions in Qualtrics with dropdown options from Zendesk

Hi Qualtrics Team,Hope you're well.We have recently include new questions in Qualtrics survey and we're having trouble matching the dropdown options from Zendesk with the questions in Qualtrics.  Unfortunately, the documentation provided by Qualtrics Zendesk Extension (qualtrics.com) doesn't explain how to do this, as it only covers text, numeric, and checkbox fields - not dropdown or multi-selection options.We need to connect this type of question with Zendesk. Can you please tell me which field to use in Zendesk to map out the answers? When I tried using a dropdown field, I couldn't reuse it. I was also unable to match it with the question I needed to link it with. Based on your expertise and experience with other customers who may have similar questions and also use Zendesk, what sort of field do they usually use? Is it a text field so that they can link to the Qualtrics question? I understand a dropdown field will display its options, but how do I connect it to the Qualtrics questi

2
VictorAV
Level 3 ●●●
8 days ago
R
rrosa
asked in Qualtrics API

Submit question response via Survey Sessions API

I'm trying to integrate a Qualtrics survey with my chatbot platform.The Survey Sessions API seems perfect for what I'm doing but the documentation is limited, so my understanding of this API may be incorrect. This is the idea:User triggers a new survey session via the chatbotChatbot calls "new survey session" endpoint, which returns SessionID as well as the first question block which contains a single questionChatbot presents the first question to the userUser chooses a responseChatbot calls "update session" endpoint, sending the chosen response and advancing the session to the next blockChatbot calls "fetch current page" endpoint, which returns the new blockChatbot presents the next questionEtc...Somebody please correct me if my understanding of the API behavior is incorrect, or if there is a better endpoint for this usecase.My question is about returning the user's response in the "update session" step. The API Doc doesn't do a good job of explaining how to map responses to questions

3
C
QPN Level 2 ●●
8 days ago
R
rrosa
asked in Qualtrics API

Clarification on Update Session API endpoint

Hi!I need to use the "Update Session" endpoint in the Take Survey API, but I don't understand how to map responses to questions in the request body. Can anybody provide example usage of this endpoint with submitting a response to a multiple-choice question?Appreciate it!

2
C
QPN Level 2 ●●
8 days ago
S
Level 1 ●
sics_sue_chooLevel 1 ●
asked in Qualtrics API

API to extract response in progress?

is it possible to pull data from response in progress via API? 

0
S
Level 1 ●
8 days ago
R
Level 1 ●
rarcegaLevel 1 ●
asked in Qualtrics API

Adding another field to the "List Opted Out Directory Contacts" API call

I was able so successfully ran an API call that listed opted outs from the directory. Aside from name and email, I also need a specific id (CID) in the output in order to link the records to our internal database. This field (CID) is an embedded data field that exists in all of our mailing lists. Is it possible to include this in the output of this API call?

0
R
Level 1 ●
9 days ago
E
ErikS
asked in Custom Code

Selected radio button color using CSS Editor

We've designed a Qualtrics survey and had a designer enter some code to match the survey to our study website. The designer is no longer on the project and we'd simply like to change the color of a radio button when it is selected. Currently, the radio button fills in white when a choice is selected. We'd like it to be blue (or anything darker really). See the screen shot below for the current design. And the current code used below that. I can't figure out where I should change the color in the code below or if there are additional lines of code. I appreciate any guidance!! Thanks in advance. ! .Skin label.q-radio.q-checked { background-color: #009FAC !important; outline: #9C9C9C } .Skin label.q-checkbox, .Skin label.q-radio { border: 2px solid #0F993D; outline: none; } .Skin label.Matrix.q-checked.q-focused, .Skin label.SingleAnswer.mobile.q-focused:hover { outline: none; } .Skin label.q-radio.q-focused.q-checked { box-shadow: 0 0 4pt 2px #0F993D; } .Skin la

3
G
Level 2 ●●
9 days ago
L
LingZ
posted in Custom Code

JavaScript for radio button color change doesn't work in vertical case.

I want my #3 radio button in red color. I used the Javascript code below. It works well in the horizontal application but doesn't work in vertical and column applications. JS :Qualtrics.SurveyEngine.addOnReady(function () {  ch = this.getChoiceContainer();  all_buttons = ch.querySelectorAll("[class^=q-]");  all_buttons[all_buttons.length - 1].id = "last_button";  last_button = ch.getElementsBySelector("#last_button")[0];  // Set border to red  last_button.style.borderColor = "red";});work well in the horizontal casebut it doesn't show red color, though the element code show" red". The sample problem happens in column application also.The code from https://community.qualtrics.com/XMcommunity/discussion/13922/change-the-color-of-radio-button-before-selection-but-only-for-the-last-responseshe works out both horizontal and vertical one year ago. I am not sure why not now. I am using the basic blank theme, and flat layout, without additional CSS.

4
G
Level 2 ●●
9 days ago
M
MorMey
asked in Custom Code

changing the side of the radio button on the flat layout using custom css

hi!I am using the flat layout, and I want to move the radio buttons from the left side of the answers text to the right side, using the custom css. (for example - on the modern layout the buttons are on the right side of the text) anyone has an idea what code can I use to do that?thank you!

8
G
Level 2 ●●
9 days ago
J
JenP_2024
asked in Website & App Insights

Web intercept action set containing form token clause

I am trying to program a web intercept survey for customers.   I’ve using an old survey intercept that was created at our company by a former employee.  They have a clause in their action set that says Current URL does not contain form token.    Does anyone know what this might mean?  On our website, we have both a pop up and feedback button survey available.  I’m trying to figure out how to stop the pop up if someone has taken the feedback button survey and how to keep the feedback button active even if the pop up survey is taken. I wonder if this form token clause might be the reason???Thanks!  

0
J
10 days ago
jerlenaz
jerlenaz
asked in Custom Code

Creating a Pop-Up Window over question options

I'm building a survey to get feedback on courses I am developing at Tulane University. I'm using the Matrix Table style of question, and have the Statements as the Course Titles. I'd like to have a pop-up window appear after a roll-over/click on the Statement that will have the Course Description if folks need more detail and information about that particular course. I don't want the question itself to be so text heavy. I see an option in the Rich Text Editor to create a hyperlink to a text anchor, but it seems like the text anchor has to be in the question itself, which kinda defeats the point of moving the text to the pop-up window. I am new to Qualtrics, but after scouring the help and community area, I can't seem to find a solution on how to do this. Does anyone have any suggestions? I'd rather not build another suite and use the URL/Anchor there, as I don't want the course information to be public yet, so any other thoughts or ideas would be appreciated. Thanks, Jerry

4
T
10 days ago
W
Level 1 ●
walliLevel 1 ●
asked in Custom Code

Pop-Up Box for additional information (working also on mobile)

Hi! I would like to add additional information for some keywords in our survey that should be displayed when hovering over the keyword (or clicking the keyword) in an additional pop-up box or tooltip. Using the html span-titel command unfortunately only works for computers but not if accessing the survey with a mobile device. Also, the pop-up box disappears very quickly on some browsers (Internet Explorer... yeah, people exist that still use it :D ), which makes it impossible to read the text. Another problem is, that on some browsers, it takes quite some time until the pop-up appears. Could someone share Java-code with me to solve this issue, or maybe lead me to a topic where this was already solved? I have digged through the community posts but weren't able to find a properly working java solution. Happy for any suggestions!

17
T
10 days ago
C
CSonn
asked in Custom Code

Insert a button that gives a pop-up additional information window when clicked

Hello, I've been looking for information on how to create a pop-up button that when clicked brings up a box of additional information - but I have only found "hover-over" options and an option for using the "next" button as a pop up option. I'd like to have a button that says "Click here for examples you can use to edit or complete your list" that appears under a text entry form. When clicked, a pop-up window would appear with information. I am new to Qualtrics with little knowledge on coding. Is there a simple way to do this without coding knowledge? If there is another page with information on this already I'm happy to be redirected. Thank you!

26
T
10 days ago
MikeBot
Level 2 ●●
MikeBotLevel 2 ●●
asked in Custom Code

Adding a pop-up for both computer and mobile devices

Hi all,I am wondering if there is a way to add an option to a survey question, where respondent can click on a word or a button to then show a pop-up box with more information?I tried the method described in the below, but couldn’t get it to work. I followed the above, without really understanding it (!!) and I get my key word underlined and showing as a tool tip, and the info will show if I hover. However, how do I get this key word to be clickable on a mobile device?  The code I have used in my survey question (HTML view) is below. The word “here” is where the tooltip is shown - but is not clickable on a mobile device.My apologies in advance if this is an obvious fix! Thanks, Mike. HTML:  Have you, or a spouse/ family member, had any of the following symptoms?<b>Please hover <abbr title="Cough; cold; sore throat" rel="tooltip"><span style="color:red;">here </abbr><span style="color:black;"> for examples of symptoms</span></span></b>  

1
T
10 days ago
F
Forno_99
asked in Custom Code

Changing color of the arrow in next buttons

Hi everyone ! Does anyone know how to change the arrow color in the next button ? I need to change it from black to white. I tried some CSS codes posted by the community in other posts, but none of them worked. I have customized the background color of some next buttons and I don’t know if the script for the arrow color is overrided by the background one. 

3
R
Level 3 ●●●
10 days ago
adawson
Level 1 ●
adawsonLevel 1 ●
asked in Custom Code

Custom Code to Hide Scale Options in Side by Side Matrix

Hi, I have the side-by-side question below with both the statements and column options being based on display logic from responses previous questions that were “select all that apply” (which solutions have you used, and which options did you use the solutions with). Solutions listed in the statements (ABCD), and the options they use them with (1234) in the columns. A respondent may use solution A&B with options 1, 2, &3, but they only used solution C with the option 1. How can I hide or disable the radio buttons highlighted so that they don’t see or aren’t able to select for those?  

1
O
QPN Level 5 ●●●●●
10 days ago
M
m_schneider
asked in Custom Code

Slider without anchoring. Handle appearing on click

Hi there! I want to implement a slider without showing the handle until the handle bar is clicked on to prevent any anchoring. Based on several posts this seems to work just fine. However, I do get it to work. Any ideas why?  Thanks a lot!

2
M
10 days ago
J
JvG
asked in Custom Code

JavaScript Multiple Price List Question

I have a multiple price list question in Qualtrics. The question type is a matrix table and the matrix type is bipolar. I  have a list of choices where the respondents first have to choose between 10 cents or the product, then between 20 cents or the product and so on until 2 euro and the product. This looks like this: "The product" or "€0.10",  "The product" or "€0.20", "The product" or "€0.30", ... and so on until "The product" or "€2.00". So 20 rows in total. QID16 is the question ID. I want to edit the JavaScript to make sure only 1 switching point is possible and to make sure that when the respondent chooses for the money, the rest of the following choices will be automatically also for the money. So when the respondent chooses for the product for the first row, nothing happens, but when the respondent chooses for the 1 euro in the 10th row, all subsequent rows will be automatically selected for the money. Also when, for example, the responder is inconsistent and then wants to sel

2
J
10 days ago
M
mhiser1024
asked in Qualtrics API

Adding Time Delay between API Call retries

When we make API calls from Qualtrics to other services, is there any way to add some time between retries? For example, when the call fails, it will automatically retry, but within a few milliseconds of each other. This generally results in continued failure. It would be great to be able to build in a long delay between automatic retries. Is this possible?

0
M
11 days ago
M
mhiser1024
asked in Custom Code

Passing Ticket Data via URL Parameters

I am using tickets to distribute a survey (after the ticket changes status, it triggers the distribution of another survey). For example, Ticket A has 15 ticket data fields. When Ticket A changes status, it triggers the distribution of Survey A. I need to pass the values of the 15 ticket data fields from Ticket A into Survey A as embedded data. I am adding the data fields to the Survey URL in the invite as I should be, but for whatever reason, only about 30% of the ticket data fields from Ticket A populate in Survey A.  Here is an example of the survey link from my email invite: ${l://SurveyURL}&JourneyID=${tck://kv/JourneyID?format=urlencode}&BrandName=${tck://kv/BrandName?format=urlencode}&ProductName=${tck://kv/ProductName?format=urlencode}&ProductForm=${tck://kv/ProductForm?format=urlencode}&totalWeeks=${tck://kv/totalWeeks?format=urlencode}&ConditionPhrase=${tck://kv/ConditionPhrase?format=urlencode} Does anyone know why I cannot pass values for all the tic

0
M
11 days ago
V
VijayataKeshari
posted in Qualtrics API

Can anybody help me with Qualtrics and Power BI integration?

I would like to extract data from qualtrics to Power Bi directly using API

1
C
QPN Level 2 ●●
12 days ago

Productivity playlist

Terms & Conditions