Developer Corner | XM Community
Skip to main content

Developer Corner

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

9319 Topics
A
Level 3 ●●●
AineLevel 3 ●●●
asked in Custom Code
Code to set up a privacy policy popup

Hello community I need your help...Does anyone know or have an example of how to create a privacy policy popup in a survey project?From what I've been researching, you need to add CSS code and code in the JavaScript session of the survey ...Can you help me with that...Thank you very much!Regards

151
O
QPN Level 5 ●●●●●
3 hours ago
S
Sarita_Robinson
asked in Custom Code
How to reformat embedded data which contains quotation marks.

Hi,I have a survey with a ‘lab.js’ screen included in it. The results from that screen are extracted and stored in a Qualtrics Embedded data field. When I view the results within Qualtrics I can see that all the ‘lab.js’ data is there but concatenated into a single cell. When it is downloaded some of this data has been truncated. I have tried to reformat this data within Qualtrics using Piped data and Javascript. I think that because it includes numerous quotation marks the Javascript is getting confused and my Javascript variables do not get populated when I try to copy the embedded data into them. I have tested that I am able to display the whole concatenation within an HTML tag on a later question screen, so I know the Piped data is accessing the right field. I am only interested in a few items at the end of the concatenated embedded data that are missing from the truncated downloaded field. Is it possible to increase the size of the downloaded embedded data? If not, is it possible

313
AlonsoC
Administrator
21 hours ago
B
baharsener
asked in Custom Code
Drag and drop with custom HTML

Hello! I am trying to have one of my questions a freeform drag and drop (e.g., participants will move icons on a screen) and I want to save either the final image or the coordinates of the icons. I only want 2 of the items to move (imagine there is a square, and the icon for ‘lunch’ doesn’t move, and you move an icon for ‘breakfast’ and an icon for ‘dinner’. I tried the following code but I cannot seem to make it work. I was hoping that someone could have better insight as to what needs to be corrected. Thank you in advance! <div style="position: relative; width: 600px; height: 400px; margin: 20px auto; background: url('https://uwartsandsciences.pdx1.qualtrics.com/ControlPanel/Graphic.php?IM=IM_eXemGs5D7yFpvhz') no-repeat center; background-size: contain; border: 1px solid #ccc;" id="slide-container"> <img style="width: 50px; position: absolute; top: 150px; left: 450px; cursor: grab;" src="https://uwartsandsciences.pdx1.qualtrics.com/Contro

40
B
2 days ago
H
Hamutal
asked in Custom Code
Answer via the keyboard in a multiple choice question with 2 options

Hi everybody :)I created an experiment that tests working memory in which digits are presented quickly (a lot of them, 38 digits in 3 different blocks), and responding via the mouse is very slow for this.I want to allow my subjects to respond using the keyboard with the letters "M" for an appropriate response, and "X" for an inappropriate response - currently the options appear horizontally with M being the response to the right answer.After wandering around the various forums, I realized that I need to write code in JAVASCRIPT but I don't understand writing code at all.I would appreciate help!I came across this question in the forum - but I still can't find a way to adapt this code to me:https://community.qualtrics.com/custom-code-12/use-keyboard-for-answering-multiple-choice-question-8398?postid=25171#post25171  

507
C
Level 4 ●●●●
6 days ago
W
warley_s
asked in Website & App Insights
Bring Embedded Data from variables present on page's datalayer

Hello, I have an intercept being presented on a page with a some data fields that I need to bring as embedded data on the responses, but I could not find a way to make it work - the fields related to them are always in blank. From what I could understand, the fields are from a Google Tag ManagerThe things I’ve already done, without success:declare the field’s value type as “HTML on site” (this works on other pages from the same client, but I imagine this page can be developed differently); declare the field’s value type as “Google Data Layer”; declare the field’s value type as “Value from cookie” (just for testing, I could not find them on cookies); Configured the event tracking on the intercept with the name of the event (“delivery_tracking”).Below it follows a datalayer viewer extension to refer as they are shown (the fields I want to bring are the ones under the event “delivery_tracking”, like “service_type”, “origin” and “destination”): Any tips on how to bring this data to the int

453
P
Level 2 ●●
7 days ago
D
davgon1774
asked in Custom Code
How to add Percentages to Incremental Value on a Slider Question

I am trying to add percentage symbols for the values given on the increments for the slider question- is there a java code or some capabilities through qualtrics to allow me to do this? 

224
D
7 days ago
2
2026657l
asked in Custom Code
Invisible Question

Hi,  I need help making a multi-choice question invisible. I have added a single choice multi-choice question in which the answer is selected when the user hits a Withdraw From Survey button in the footer to withdraw and go straight to the debrief. This all works fine, however I have tried JS code from other posts on this forum and cannot get my multi-choice question to become invisible - the question is just a blank space but the radio button is still visible and highlights blue when the withdraw button is used.  Here is the current working JS Im using in the question. EndNow is the name of my withdraw button: Qualtrics.SurveyEngine.addOnReady(function() {var that = this;var endBtn = document.getElementById("EndNow");function skip() {that.setChoiceValue(1, true);that.clickNextButton();};endBtn.addEventListener("click", skip);});

110
2
8 days ago
O
Oliver_Durcan
asked in Custom Code
Edit background height when survey is in full screen

Hi all,I have created a button that forces my survey into full screen. When in full screen, the blocks that scroll beyond the standard height of the page (ie. that require scrolling down) switch from the default background colour to a solid white. This is not a problem when not in full screen. See the screenshot attached that shows the lavender colour cut off to white when the page scrolls down: My question is - Is there a way to extend the lavender colour to the bottom of the page whilst in full screen?Many ThanksOly

1218
J
8 days ago
V
Level 2 ●●
Vinoth_MathaiyanLevel 2 ●●
asked in Custom Code
Need Help with CSS to Change Text Color on Hover

Hi everyone,I'm working on a survey and in an answer option I do have a hyperlink. When I hover over the option, I want all the text, including hyperlinks, to change to white. However, I'm having trouble getting the CSS to work correctly.Here's an example of my HTML structure: <b>Option Text <a href="link" target="_blank">htext</a></b><br> <span style="font-size: 11px">additional text</span>.choice.radio:hover a { color: white; /* Ensure link text color also changes to white */ }Due to the trial version, I cannot show the full functionality. When I hover over the option, all the Option Text becomes white, the htext becomes light blue, and the background becomes dark blue.Could anyone help me with the correct CSS to ensure all text, including hyperlinks, changes to white on hover?I've also added a screenshot from the trial login to make more sense to the users.Thanks in advance! 

372
V
Level 2 ●●
8 days ago
c.rose
Level 2 ●●
c.roseLevel 2 ●●
asked in Website & App Insights
Uncaught (in promise) Error

Hello, I am seeing in the console on my site the following error, seemingly related to Qualtrics. I have a support ticket but they’ve been unable to replicate so far. Any ideas what this could mean?"Uncaught (in promise) Error: Loading chunk 12 failed.(error: https://siteintercept.qualtrics.com/dxjsmodule/12.8fb54ff2c385347a3180.chunk.js?Q_CLIENTVERSION=--blocked--&Q_CLIENTTYPE=--blocked--&Q_BRANDID=--blocked--" 

2009
Michael_Cooksey
Administrator
11 days ago
sofiadavila02
Level 1 ●
sofiadavila02Level 1 ●
asked in Integrations
Extract Recruiting Data from SuccessFactors

Greetings to the community!I am facing an issue in my Data Recruitment (SSFF)  that utilizes a native integration with Qualtrics fot a Candidate Experience project. The situation is as follows:Problem: Despite the native integration between my Data Recruitment system SSFF  and Qualtrics appearing to work correctly in terms of adding contacts to the directory, I am unable to view candidate data. This includes crucial information such as names, email addresses, and other relevant details. The candidate viewing screen is blank.Question: Has anyone experienced a similar issue or have any idea why this native integration is not allowing me to view candidate data? Are there any additional configurations I should be aware of or possible solutions I can try?I appreciate any help or suggestions you can provide. Thank you in advance for your support! 

691
E
QPN Level 4 ●●●●
12 days ago
V
Level 2 ●●
VioletaLevel 2 ●●
asked in Custom Code
Help with JavaScript code: Calendar (Staring Year)

Hi there,I need to update the default calendar field to start displaying years from 2023 onwards, instead of showing earlier years.JavaScript is beyond my capabilities - could someone please assist me with this?Many thanks in advance! 

787
V
Level 2 ●●
14 days ago
Bridget7131
Level 1 ●
Bridget7131Level 1 ●
asked in Custom Code
API call for emailing individuals not list on specific date

Hello All, I’m using an API call to automate an email reminder for a second survey link on the date provided by each respondent in the first measure of a longitudinal survey. This is working, but it is sending a reminder email to the whole contact list every time a new respondent triggers the workflow. I only want it to send the email to the one participant who specifies that date, on that date. So each respondent only receives one reminder email on the date they previously specified in the first measure (as it is, people would end up with thousands of reminders). I hope that makes sense. It can be an anonymous link that goes out because there is an authenticator on the second measure, which seems to be working fine (i.e. the embedded data from measure one is piping through to measure two correctly for specific individuals). But the anonymous link needs to go to the specific participant on their specific date, not to every contact on the list on each date.I read a post suggesting makin

423
TomG
Level 8 ●●●●●●●●
15 days ago
JesperAndersen
QPN Level 4 ●●●●
JesperAndersenQPN Level 4 ●●●●
asked in Qualtrics API
Copy participant via web service in survey flow

I would like to add a participant from the directory to a specific project as part of a survey flow, but for some reason I can’t make it work.I have this setup:It should be straight forward, but I struggle to get the body part right. According to the documentation:https://api.qualtrics.com/c03ae4b3e935d-copy-participantsIt should be like this:[  "1234"]I get an “body should be an array type.” error, but the JSON selection should create this.Any help would be much appreciated!

260
JesperAndersen
QPN Level 4 ●●●●
17 days ago
A
AJ1243
asked in Custom Code
Multiple-choice question survey layout

I am designing a survey in qualtrics. A part of the survey requires that people view a pdf on the left side of the screen and then have the answer options on the ride side of the screen. I have been able to add CSS code to make sure that the scrollable PDF is inserted into qualtrics. But I can't seem to find a way to make the native answer layout allow these beside the questionSee image for referenceI have tried a number of CSS codes; none of them have worked. Any suggestions?

1108
Deepak
QPN Level 8 ●●●●●●●●
19 days ago
S
SavioJames
asked in Integrations
Assistance Needed: Qualtrics to SuccessFactors Integration Issue

Hello Community,We are encountering an issue with our integration between Qualtrics and SuccessFactors. The error message we receive is: "Unable to connect account; review credentials and try again."We have already checked the following details:Username:  API Key:  Datacenter Domain:  X.509 Certificate Private Key: ... Company ID: Despite confirming that these details are correct, we are still facing connection issues. Has anyone experienced a similar problem or have suggestions on how to resolve it? Any assistance or advice would be greatly appreciated. Regards | Savio

1043
AlonsoC
Administrator
19 days ago
E
Level 2 ●●
Eltion99Level 2 ●●
asked in Custom Code
Validation check between two question

I need help with setting up a validation check between two questions. Q1 is a multiple choice question with numeric buckets. Q2 is a multiple choice question with a required entry field for which the entered value MUST be within the range selected in Q1. One cannot proceed to the next screen until correcting their response. How do I set this up?I am including a screenshot of the two questions as well as the JavaScript I am using but does not seem to be working properly.  Qualtrics.SurveyEngine.addOnload(function () { // Define the ranges for Q1 in an object const ranges = { '1': { min: 0, max: 19 }, '2': { min: 20, max: 49 }, '3': { min: 50, max: 99 }, '4': { min: 100, max: 249 }, '5': { min: 250, max: 499 }, '6': { min: 500, max: 749 }, '7': { min: 750, max: 999 }, '8': { min: 1000, max: 2499 }, '9': { min: 2500, max: 4999 }, '10': { min: 5000, max: 19999 }, '11': { min: 20000, max: 49999 }, '12'

595
vgayraud
QPN Level 5 ●●●●●
20 days ago
P
Level 2 ●●
preichowLevel 2 ●●
asked in Qualtrics API
Chrome Warning that Qualtrics using a deprecated feature: Unload event listeners are deprecated and will be removed.

Hi everyone,Google Chrome is saying that the one of the JS files served by Qualtrics is using an unload event listener that will soon be deprecated.The file:https://siteintercept.qualtrics.com/dxjsmodule/8.29a12639f19bc166d5bc.chunk.js?Q_CLIENTVERSION=2.21.0&Q_CLIENTTYPE=web&Q_BRANDID=The offending line;e.addEventListener ? e.addEventListener(t, n, !1) : e.attachEvent ? e.attachEvent("on" + t, n) : e["on" + this.capFirst(t)] && (e["on" + this.capFirst(t)] = n)) Does anyone know if Qualtrics is going to address this?   I searched for this on Google and only found one results that wasn’t really related.  I can’t believe we’re the only company on this planet with this issue. 

230
P
Level 2 ●●
20 days ago
H
HarshithaRamisetty
asked in Website & App Insights
UnCaught Reference Error:Qualtrics not Found

Hi,I am in an requirement to add the javascript code into an existing website code which basically functions to capture the embedded data such as CAID and Email ID which I have configured these fields in the survey flow of the particular survey and also in the website intercept embedded data by choosing the type as the Value from Javascript in order to store the values for the particular embedded data field from the javascript code . The javascript code which I have incorported in the existing website code    <script>Qualtrics.SurveyEngine.addOnLoad(function(){Qualtrics.SurveyEngine.addOnPageSubmit(function(type){if(type == "next"){            var EmailID = "xxx@xxx.com";        var CAID = 935326;            Qualtrics.SurveyEngine.setEmbeddedData('EmailID', EmailID);Qualtrics.SurveyEngine.setEmbeddedData('CAID', CAID);    }});});    </script>and also I have placed the website intercept deployment code at the header section I am getting the “Uncaught ReferenceError Reference

761
P
Level 2 ●●
20 days ago
E
enyx
asked in Custom Code
Options overlay survey page

I have used a custom code to have a dynamic drop down multiple choice question as per the link belowwhile using the select2 html code:<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" /><script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>I do this to 2 sets of questions in my survey, the first set appears mostly fine, except that you see the last option on the top left as well. And when I copy the question and shift it to another block, the second set has the selection box on the page where it appears. And in the subsequently pages, the whole list of options appears. I have tried deleting the question and the overlay disappears, but when I create the question from scratch, the same issue appears again.Page with dynamic drop down multiple choice questionPages after the above pageWould appear any help to resolve this.

231
E
22 days ago
P
ppuente
asked in Qualtrics API
Create a New Response API and Embedded Data

I want to call the Create a New Response API to create survey responses from my application (https://api.qualtrics.com/f1cad92018d2b-create-a-new-response). I don’t see a way to add embedded data to that request. Is there a way to create add embedded data with a survey response creation request, or am I required to send a subsequent Update Response request (https://api.qualtrics.com/daed82306b1ea-update-response)?

270
P
25 days ago
B
Barnett24
asked in Custom Code
Help with Javascript code: Calendar

I have uploaded from the "Import Library" in Qualtrics and have a matrix styled calendar option for the "month" and "year." The problem is I want to ONLY display the months January-December and the years 1940-2021. Can someone please help me with that? How do I change the drop down options to only show that range?

966
V
Level 2 ●●
26 days ago
M
MohamedAli
asked in Qualtrics API
Change one of the form field to dropdown

Hi all I need to convert one of the form field (2nd field) to dropdown. I try to search and did not manage and did not understand why the script does not work.below is my Javascript. But it still did not change to the dropdown,  Qualtrics.SurveyEngine.addOnload(function() {    var qid = this.questionId;    // Define the dropdown element and options    var dropdown = `        <select id="QID31-2">            <option value="">Select an option</option>            <option value="tech_data">Tech data (affected)</option>            <option value="non_tech_data">Non-tech data (affected)</option>            <option value="not_affected">Not affected</option>        </select>    `;    // Insert the dropdown after the second field and hide the original input    jQuery(dropdown).insertAfter("#" + qid + " .InputText[name='QID31-2']");    jQuery("#" + qid + " .InputText[name='QID31-2']").hide();    // Ensure that the dropdown element exists

321
C
Level 4 ●●●●
27 days ago
F
Flintstone81
posted in Custom Code
Form question that also contains a dropdown question

I have a demographic question and I want the state to be a 50 state drop down.  Can someone help me with this? 

422
C
Level 4 ●●●●
27 days ago
A
andrp
asked in Integrations
Issue during SAP Customer experience General Response mapping

Hello, Does anyone have experience with General Response Mapping to SAP Customer Experience?I have followed the guide posted by SAP herebut I am getting the below error when trying to add the SAP CPI iflow endpoint: Here is a screenshot of the iflow in CPI:  Thank you!

170
A
27 days ago

Motivational Playlist

Terms & Conditions