Developer Corner

Hi!I am trying to display a total score that is calculated based on the average of respondents' entries to a form displayed on the same page.The default values of the form input fields (QID13) are piped from prior questions. I would like:1) the total score to display the average of these default values upon loading the page, and; 2) the total score should update whenever the respondent changes the value of one of the form input fields.I know I need JS for this, and I found useful discussions here:https://community.qualtrics.com/XMcommunity/discussion/5854/how-to-display-score-on-survey-page-that-dynamically-updateshttps://community.qualtrics.com/XMcommunity/discussion/9743/display-math-operation-results-real-timeMy knowledge of JS is pretty much limited to being able to copy and paste it, so for me the code in these threads is just one or two steps too far removed from what I am trying to do.Any help is much appreciated!

Does anyone know how I can pull just the total counts of responses for a survey via Python?

Hello! I’m trying to figure out how to subtract days from an input date from flatpickr using Moment.js’s subtract function, and display that in a subsequent survey question.The following is the JavaScript I used to ask participants to select one of the days the past 3 days from the current date using flatpickr: Now, I would like to create a new variable which is the day prior to what was selected in the next question. For example, if the date 2023-08-23 was selected, I want to create an output of 2023-08-22 in the next question using Moment.js:How do I properly create a variable which subtracts a day from the previously inputted date, and how do I display that date into the question? I’m not familiar with coding, so any guidance or help would be greatly appreciated!   

Does anyone know how to have piped text display as a list instead of a paragraph separated by commas?For example, piped text will display selected options such as: “Take my medication, Set a reminder, Talk to a friend, Other, make time to do it”I would like it to display as:Take my medicationSet a reminderTalk to a friendOther, make time to do it.  Thank you! 

I’ve got a matrix question with 10 scale points. There isn’t a specific cut-off, but I want participants to provide context around why they rated the lowest two statements the way they did. I’m trying to find out how to plug the lowest-rated and then the second lowest-rated statements into a loop & merge. I was able to achieve this once before using a bunch of logic in the survey flow, but that time around I had a set cut-off value (i.e., select 2 statements rated below 3).This time it’s just the lowest two statements. I’ve been looking around, and I’ve seen that some custom JS may be able to do this but I cannot find out how to do it and am very inexperienced with Java.This is the question I want to take the lowest rated statements fromThis is what I want to loop and merge  

Hi everyone,  I’m trying to get my code to work but I can’t seem to get it going. Does anyone have any thoughts on it?I want to select the lowest rated statement and put it into the embedded data that is named as such, my code is below: Qualtrics.SurveyEngine.addOnUnload(function(){    var matrixQuestion = 'QID38';    var numRows = 14;    var lowestRating = Number.POSITIVE_INFINITY;    var lowestStatement = '';    var responseLabels = [       "${e://Field/QID35_R1}",        "${e://Field/QID35_R2}",        "${e://Field/QID35_R3}",        "${e://Field/QID35_R4}",        "${e://Field/QID35_R5}",        "${e://Field/QID35_R6}",        "${e://Field/QID35_R7}",        "${e://Field/QID35_R8}",        "${e://Field/QID35_R9}",        "${e://Field/QID35_R10}",        "${e://Field/QID35_R11}",        "${e://Field/QID35_R12}",        "${e://Field/QID35_R13}",        "${e://Field/QID35_R14}"    ];    for (var i = 1; i <= numRows; i++) {        var rating = parseInt(Qualtrics.SurveyEngine.getEmbe

I am trying to implement a task where participants watch a quick video and then must make one of two keyboard responses to the video. I would like the page to auto-advance once this keyboard response is made. If possible, I would also like to record how long it takes to make a keyboard response following the completion of the video. Is there any Qualtrics feature or code I could use for this?

I customized the color of the radio buttons and fill on my survey, so when a respondent click on a response, it turns blue. But now, when the respondent moves on to the next question, the response selection on the previous question reverts back to the original background color. Please halp! This is the code I’m using which is likely very messy and filled with errors: .Skin label.MultipleAnswer>span::before {border:2px solid #000000!important; }.Skin label.SingleAnswer>span::before{border:2px solid #000000!important; }.Skin label.MultipleAnswer.q-checked>span::before {border:2px solid #000000!important; background-color:#4592FF!important;}.Skin .TE .ML .InputText, .Skin .TE .SL .InputText, .Skin .TE .ESTB .InputText  {    border: 2px solid #000000 !important;    background: #00000;    color: #00000;    border-radius: 25px;}::placeholder { font-size: 32px;color: #0000; }.Skin label.SingleAnswer.q-checked.q-focused>span::before{border:2px solid #00000!important; background-col

Hi AllI don’t want to edit my admin theme, how would I remove the footer for all my survey or just 1 question.Thanks :)

Hello!  I’m completely new to Qualtrics and not familiar with coding in general. I would like to utilize flatpickr for my survey and have been going through previous posts on how to install it in my survey. However, I’m having trouble doing so. I’m hoping someone can tell me what I’m doing wrong in trying to implement flatpickr. First, I’ve went into [Look and feel] → General → [Header] → pressed the edit button → pressed the  source button, and inputted the following  code (see image for reference):  <link href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css" rel="stylesheet" /><script src="https://cdn.jsdelivr.net/npm/flatpickr"></script> Then, I’ve went into my survey → one of the questions I would like to edit → [Rich content editor] → pressed the source button, and inputted the following code (see image for reference): Qualtrics.SurveyEngine.addOnload(function(){ jQuery("#"+this.questionId+" .InputText").flatpickr({enableTime: true, altInput: true,

Hi,  I'm looking to implement several fields for a spontaneous awareness question.My idea is to have a first field as they open the question. Once they are typing into the first field, I would like another field to appear, and so on until maybe 10. I tried to enter a Javascript code but didn't seem to work.Could soneone provide me with a Javascript to do it? Thank you very much

Hi Qualtrics community,  We would like to pipe an unique image into the message to the respondent, every respondent will receive an unique image. We have the image in url. Is there any way to tweak the html code to show the actual image? Thanks.

I'm trying to add dynamic watermarks to images in my survey, which would add a unique identifier (passed through the survey link) to all images. I found this question but I haven't been able to get the watermark to work: https://community.qualtrics.com/XMcommunity/discussion/9316/display-a-dynamic-watermark-on-an-image.In Look and Feel-->General-->Header, I added this as source code: https://www.jqueryscript.net/demo/Add-Image-Or-Text-Watermarks-To-Images-with-jQuery-watermark/dist/jquery.watermark.min.js" type="text/javascript">However, I'm not sure how to implement this JS to get the watermark to appear on my images. I tried adding it to the specific question under Edit Question JavaScript, but nothing happens :$('img.watermark').watermark({ text: 'GOOGLE.COM', textWidth: 100});What am I missing? What do I add to this above JS to reference my image?

Time for the 2023 version of our favorite question - how to implement select2 with ajax data in Qualtrics!From Qualtrics, I need to pass the study site selected on the form to my API and get back a list of study participants to put into a select so the desired participant can be selected. What is the proper way to do this?I tried making the API call in the Survey Flow, setting an embedded data variable for the data coming back, and pointing the select2 ajax data at it but that is not working. The API is sending the data in the correct select2 format (https://select2.org/data-sources/arrays). I can see it in Postman. But nothing is showing in Qualtrics.I also thought I could call the API from the select2 ajax URL but I don’t know the syntax for sending the Qualtrics parameters to it on the URL so bailed on that attempt and came here.I followed this 4 year old article for the basic setup so I have the correct header css/js, question type, and question JavaScript.  Qualtrics.SurveyEngine.

This is my JC code. The key codes seem to be working but no data is being reported in the file. Qualtrics.SurveyEngine.addOnload(function(){    var qid = this.questionId;    document.onkeydown = function(event) {        console.log('keydown',event);        if (event.which == 37) {            event.preventDefault();            Qualtrics.SurveyEngine.registry[qid].setChoiceValue(1, true);            jQuery('#NextButton').click();              `Qualtrics.SurveyEngine.setEmbeddedData('F64', 1);`        } else if (event.which == 39) {            event.preventDefault();            Qualtrics.SurveyEngine.registry[qid].setChoiceValue(2, true);                 `Qualtrics.SurveyEngine.setEmbeddedData('F64', 2);`                      jQuery('#NextButton').click(); This is my work flow incase this is the problem: 

Hi!I need. help in setting logics in one of my surveys.I am trying to write a Java Script code that. would enable me to dynamically change text in a text question depending on the choices in a previous hot spot question. Could anyone help me how such a code would look like?

The defualt language selection box has the word “Language” above it, which is switched between different languages each time a language option is selected.How do i edit that word “Language”? I would like it to be bilingual. For example, ”語言 Language”, shown bilingually accordinlg to the existing language options.Your help will be much appreciated. Many thanks! 

For highlight question types, I need to count the number of instances a category is used. I cannot find an option to set an embedded variable with the # instance where X category was highlighted. Is there javascript to count instances? Or is there a way to count instances of a category with piping? For example, you have a participant read a passage. Another person marks any instances where they read a word incorrectly. I want to be able to count the instances of ‘incorrects’. I can do this using regex and pivoting longer on the backend, but it would be better if there was a way to set the incorrect count in an embedded variable. Thanks!Kerry

I am trying to implement a timer so that after a given time the user is automatically moved to the next block.This questions is literally EXACTLY what I am trying to implement: https://www.qualtrics.com/community/discussion/comment/5616#Comment_5616In that question, someone said I should create embedded data before my block with a value of 180.Then, apparently, the following code should automatically move the user to the end of the block after 180 seconds.var timeleft = parseInt("${e://Field/TimeLeft})");var timer = setInterval(function () {  if (timeleft 

Hi everyone,I'm trying to retrieve the current time from a 'Timing' question type using JavaScript. I came across some older code that appeared to work in the past, but unfortunately, it's not functioning for me now. You can find the code snippet below. Does anyone have insights into what might be causing the issue? Is it possible that the class for the 'Timing' question type is no longer named 'Timer FlipClock'?I greatly appreciate any assistance you can provide!Here's the excerpt from the code that's relevant: Qualtrics.SurveyEngine.addOnReady(function(){var timerID = document.getElementsByClassName('Timer FlipClock')[0].id;       […]       Event.observe(document, 'keydown', function (e) {              var time = $(timerID).getAttribute('time');              […]       });});

I think the Set embed data block should appear before the script executes like this assuming the script executes in Block 8:I am unclear where to put the script to record the data. This is where I put it:Qualtrics.SurveyEngine.addOnload(function(){    var qid = this.questionId;    document.onkeydown = function(event) {        console.log('keydown',event);        if (event.which == 37) {            event.preventDefault();            Qualtrics.SurveyEngine.registry[qid].setChoiceValue(1, true);            jQuery('#NextButton').click();        } else if (event.which == 39) {            event.preventDefault();            Qualtrics.SurveyEngine.registry[qid].setChoiceValue(2, true);            jQuery('#NextButton').click();        }    }});Qualtrics.SurveyEngine.addOnReady(function(){    var qobj = this;    setTimeout(function() { jQuery("#"+qobj.questionId+" .hideAfter45").hide(); },5000);});Qualtrics.SurveyEngine.addOnUnload(function(){    `Qualtrics.SurveyEngine.setEmbeddedData('FIELD',

Hello everyone, I'm new to Qualtrics, I wanted to save the data in qualtrics from custom javascript code. can anyone tell me how to do that ? Thanks, Abhi

This is a situation that we run into a lot.  We have an extremely inefficient way to resolve this, so I am hoping that someone has a suggestion that works better. Here is the scenario:QID1 is a “Select All” Question, with an “Other” choice with a text box QID 2 is a “Rank Order” question that carries forward the selected responses If only one choice is picked for QID1, QID 2 is skipped.What we are trying to do:When only 1 choice is selected, we want the choice to populate QID2.  In addition, we want the rank for that choice populate with a 1. We want the rank to populate the “Other-text” rank field, instead of just the “Other” rank field. Any assistance would be greatly appreciated.  Thanks!

Hello,I have added the Calendar DatePicker from the Qualtrics Library to my survey, but the all the header text, including nav buttons, is white (see photo). How can I change the color to black?I have tried two things so far:1) I have tried to edit the HTML view on the question itself, see below (note the multiple places I try to put color: 'black' What is the target first date of the study?https://ajax.googleapis.com/ajax/libs/yui/2.9.0/build/calendar/assets/skins/sam/calendar.css"> https://ajax.googleapis.com/ajax/libs/yui/2.9.0/build/yahoo-dom-event/yahoo-dom-event.js"> https://ajax.googleapis.com/ajax/libs/yui/2.9.0/build/calendar/calendar-min.js"> Qualtrics.SurveyEngine.addOnload(function (){ var qid = this.questionId; var calid = qid + '_cal'; var y = QBuilder('div'); $(y).setStyle({color: 'black',clear:'both'}); var d = QBuilder('div',{className:'yui-skin-sam'},[  QBuilder('div', {id:calid}),  y ]);   var c = this.questionContainer; c = $(c).down('.QuestionText'); c.appendChild(

Hello!I’ve created a feedback tab that will appear on all pages of my company’s website.   Can anyone confirm if the “Current URL” embedded data field  captures the URL a visitor was on when they clicked the feedback tab? The support site says that “Current URL” logs the URL the visitor was on when the intercept appears. I want to associate feedback with the specific URL a visitor is on. Since the feedback tab will appear everywhere, I am not sure it will capture the first page they saw, or the URL the visitor was on when they accessed the feedback tab.