Custom Code

Hello, I want to create a JavaScript script for an uploaded video (from the library) that will address the following issues:1. The video should appear automatically (autoplay).2. The size should fit various screens, especially laptops, cellphones, and tablets.3. Participants will not be able to click on the next button until the video reaches its end.For issue 1, I'm using this code:```html<video autoplay loop=true style="pointer-events: none; width: 80%">    <source src="my video" type="video/mp4" />    Sorry, your browser doesn't support embedded videos.</video>```For issue 3, I haven't used any code. Instead, I added another "timing" question to the page and delayed the display of the next button until the end of the video (I inserted the time it should stop).The problems I'm encountering are:a. The video continues to play despite the next button appearing at the end of the segment. The video loops, and I want to stop the looping and end playback when the video's t

Hi community,I’m trying to set up a survey with lots of service topics, and all the topics share the same time slots. People can choose max. 2 topics and 2 different time slots in a single response, and I hope that when a respondent answer the second question for choosing time slot, the time slot they selected in the first question will automatically disappear, which can prevent respondent from choosing the same /duplicate time slot for 2 different topics. ( Since they could not attend 2 service in the same time) Below is the only way I know to make the selected choice disappear (the questions below are all different topics) , but it is very manual to add every display logic in every time slots. Do you have any good ideas on it? Very appreciate for the reply if someone knows :)   

Hi, I am including some custom Javascript to add in text for response options that appear when hovering over the response text. If the survey respondent does not have Javascript enabled, how does that affect the display and functionalities of the survey?  Thanks!

Hello Qualtrics community! I am posting because I would like to see text selection made available for USERS of the survey to select text from generated survey responses. USERS = general public accessing surveys, not Qualtrics account holders. I am trying chrome extensions and other methods for working around this terrible website decision, and would appreciate any and all ideas about how to make text selection possible! To note, I realize there is a PDF option available for download, but this does not meet our needs either. Selecting text from a website is such a basic function! 

¿Hay alguien que conozca como hacer una encuesta incrustada para una pagina web? Gracias

Hi Everyone,My friend and I are currently creating a survey for our master project. To shortly describe the essence of the survey: we aim to provide the respondents with financial information (namely Revenue, Costs and Net Earnings), where they then need to predict the revenue and costs for the forthcoming year. Once they have done that, we would like the survey to display how far off they were (in percentage). We have tried to adjust the java script to incorporate it, but it just constantly says the answer deviated 100%. Do you know how to display how far off the respondents were once they have completed the survey?. We possess the unique IDs for input fields. However, it seems that it makes the deviation before the respondents have given their answer (hence the deviation of 100%). The code (sorry for the Danish phrases):Qualtrics.SurveyEngine.addOnReady(function() {    // Define the actual numbers    var actualOmsaetning = 100;    var actualOmkostninger = -80;    var actualAaretsResu

Hello everyone,I need help with JavaScript as I am quite a novice. I have a pick,group,rank type of question (named "Q1”). There is only one group, and 19 choices (choices are letters, not numbers), participants are allowed to put as many choices as they want (no restriction, can be 1, can be 7) into the group by dragging them to the group, and then rank them in the order they want. In the next question, I want to carry-forward their choices in the order they have put (just to repeat as text question, not as choices), but when I do “carry forward” it does not consider the ranking. I am guessing the best way is to create an embedded field by javascript that saves the rank. I attempted to modify some JavaScript codes I found here, but none of it worked. I would greatly appreciate any help with this. Thank you in advance.-DA recent JS I tried, most probably very wrong as it does not work:Qualtrics.SurveyEngine.addOnload(function(){    /*Place Your Javascript Below This Line*/        // st

In my survey participants will need to rank the following chocolate bars from most preferred to least preferred: Snickers, Mars, Twix, Bounty, Picnic, Kit Kat, Milky Way, Crunchie, Cherry Ripe, and Twirl. This is a rank order type question and the format of the question is drag and drop. After participants rank the chocolate bars from most preferred to least preferred I would like to display their two most preferred chocolate bars and three least preferred chocolate bars on the following screen. They will then need to choose one of these five bars. Here is what I have put down in the survey flow: In my item ranking question I have included the following javascript:Qualtrics.SurveyEngine.addOnload(function() {    var rankQuestionId = 'QID14'; // Replace with the actual Question ID of the Rank Order question    var rankData = [];    jQuery("#" + rankQuestionId + " .draggable").each(function() {        var choiceText = jQuery(this).find(".draghandle span").text();        var ranking = jQu

I couldn’t find this question asked or a similar solution anywhere, my apologies if it is covered elsewhere. I wanted to make a date picker but wanted to avoid third party dependencies like what is needed with flatpickr.  HTML5 has a native calendar input type, let’s try to use that!  I got it working, but have to manually define the QID variable rather than building it as a string like is shown in many of the flatpickr examples here. So I have this code in my question’s HTML:<input id="datepicker" type="date" />Then I have this in the Questions’ javascript:Qualtrics.SurveyEngine.addOnReady(function(){jQuery(document).ready(function(){ jQuery("#datepicker").change(function(){ var selectedDate = jQuery(this).val(); jQuery("#QID3 .InputText").val(selectedDate); });});});It works great!  But, look at the last line of data there-- I am manually defining the QID string rather than building it on the fly.  That is because the whole thing is nested so the ‘this’ keyword is not l

In the survey I am building, respondents may select multiple options from a list of titles, each of which is associated with one or more dates. The list of titles and their dates is different for each respondent, and will be stored in a contact list.Based on the subset of titles a respondent selects, I would like to retrieve all the relevant dates so I can ask questions pertaining to those dates. Is there a good way to reference and then filter the embedded data from the contact list based on selected values? I suspect JavaScript will be important here, but it’s not my strong suit. To clarify, suppose we had a contact list formatted like this:email address titles dates one@example.com “Yes, this is an example.” || “Another example might look like this.” 2021 || 2018 two@example.com “I have a lot of titles to my name.” || “This title is not like the others.” || “Another example might look like this.” 2017 || 2022 || 2018  I am then posing a question like, “Which of these

Hello,I have a Custom End of Survey element to show a response summary, and I checked the box “Show Response Summary before completing the survey” because we would like respondents to have the opportunity to review their responses before submitting them. Unfortunately, the response summary is auto-forwarding and submitting the survey responses after appearing for just a couple seconds.I reached out to Qualtrics Support for an explanation, and their tech team said that this is occurring because of custom JavaScript code that I was using to hide a question on the survey. Specifically, they said the code to automatically click the “next” button on the hidden question was somehow also clicking the “next” button when the response summary appeared (though it’s a mystery to me as to why that would happen). They said that removing that JavaScript code should resolve the issue, but I need it to hide a form question that is saving question response values to be used as the key in a subsequent Lo

Hello everyone, Wish you all the best for this new year :)Find below a screenshot of one of my survey star rating question, as you can see I feel like we don’t see the stars enough, is there anything I can do to highlight them or maybe add square around them. Note that I already have below Javascript for the question : Qualtrics.SurveyEngine.addOnload(function() {jQuery("#"+this.questionId+" tr").each(function() {var row = jQuery(this);var th = row.after("<tr></tr>").find("th").attr("colspan","4").css("text-align","left");th.remove();});$('thead').remove();});Let me know if you have any idea :) 

My javascript works, the only issue is that it only works when first going back to the page that has the questions and then press next again.  Each script is set to one question that has javascript. All QID questions are on one page, the survey also goes automatically to the next page after selecting an option for each multiple choice (single choice) question.Qualtrics.SurveyEngine.addOnPageSubmit(function () { var answer = "${q://QID212/ChoiceGroup/SelectedChoices}"; if (answer == 'Kromstraat 72/72a' || answer == 'Logeerboerderij') { Qualtrics.SurveyEngine.setEmbeddedData('Filter2_Logeren', answer); Qualtrics.SurveyEngine.setEmbeddedData('Filter16', 'Zelf doen'); }});Qualtrics.SurveyEngine.addOnPageSubmit(function () { var answer = "${q://QID250/ChoiceGroup/SelectedChoices}"; if (answer == 'Ja') { Qualtrics.SurveyEngine.setEmbeddedData('Filter2_NSO', 'Xieje'); Qualtrics.SurveyEngine.setEmbeddedData('Filter16', 'Zelf doen'); }});Qualtrics.S

Hi, I am trying to group postcodes to LGA’s (e.g. postcode 2016 to code frame 106) but it’s being coded to 105..all the codes are off by 1..how can i fix this bug?   

Hello! I’ve tried the following regex to test for text entry answers (string) that contain 6 to 10 characters: ^.{6,10}$While this works for validating the question, it does not work for terminating respondents whose answers don’t fall within these parameters.(I’m aware that I could change the data type from string to number but I am new to coding so not sure how to do so in javascript -- a kind person shared code for automatically adding commas to currency numbers but this makes the value a string so I’m trying to figure out how to validate based on number of characters).

Hi, I have multiple fonts files saved in the Library. On a survey I’m using I would like to add in the ‘Look & Feel’ external CSS a code that will override ONLY IN SOME LANGUAGES the default font and will choose the font from my library (the code I guess will contain a URL).  Anyone ever done that? (@vgayraud  I’m tagging you here, as it seems you have lot’s of knowledge when it comes to these tricks… and you just saved my life in another post)

We have been using the JS below directly within a form-type question to 1) add the "$" before each of the input fields and 2) validate so that only numerical values are entered and they are converted to display commas to the respondent when it is 1,00+ (our respondents have values in the millions +).We have this all working properly; however, I would like to run calculations with these values after a page break within a text/graphic question type. In order to do so for any values for 1,000+ , I'd have to convert from a string to a numerical value to allow the Qualtrics calculation to work. Is the conversion something that I could add to the Unload portion of the JS on the same question just below this script? Forgive me, I'm still quite the beginner with JS and I also couldn't find a similar existing question in my search.Qualtrics.SurveyEngine.addOnload(function(){ /*Place Your JavaScript Here*/ // This code adds # prefix before textbox var questionId = this.questionId; var prefix = "

HI, I am trying to make drag & drop questions more user-friendly on mobile. A key UX issue is that an item resizes and overlays the groups once it is dropped. Has someone any ideas for a code which modifies an item once it was dropped to achieve either of:making the item disappear  preventing the item from resizing to a more narrow width I am pretty sure the drop event can be modified, e.g. from Jacobz1Qualtrics.SurveyEngine.addOnload(function() {    // Function to handle the item drop event    function handleDropEvent(event) {        event.preventDefault();        var data = event.dataTransfer.getData("text");        var originalItem = document.getElementById(data);

Does anyone know the steps to embed a survey question from Qualtrics into an external webpage please?Use case: Collecting in-the-moment NPS for employee health and wellbeing resources.

I am setting up a study in which participants first go through 40 items that are presented one by one, preferably in a random order, and choose for each item whether they want to study it or be tested on it in a later phase. I've implemented this using a loop and merge block.  Then I want participants to go through the same 40 items again one by one,  preferably in a random order, and either see the item again for study or get tested on the item (i.e., text entry question) - based on their earlier choice for that item. I've tried to implement this phase using a different loop and merge block but I cannot see a way to use display logic (in order to determine whether the item would be studied or get tested) based on participants' choice in the earlier loop and merge block.  I also tried to implement both phases in one loop and merge block, but I cannot see a way to make it loop through some questions first for all the items and then to loop through other questions for all the items. Any

Hi EveryoneHope you're well.If I asked someone to paste a URL into a text field, and I wanted to also save the last part of the URL into my survey results as a new data field (which would always be "/a number"), how would I do this?Thanks :)

I have my account set to GMT +8 and recently set up a workflow for Microsoft teams notification whereby the Survey End Date is piped in as part of the message.  ${rm://Field/EndDate} Unfortunately this piped text turns up in UTC instead of GMT +8 / respondent’s local time. Is there a way around this? i.e storing the date and time from the respondent’s location

Hi All, I have a matrix question that has 9 response options (it's an established scale, so I don't want to monkey with this). When I try to display it, even if the window is sized large enough, the matrix question gets clipped and requires the use of a horizontal scroll bar to see the last several options: ! Is there some CSS (or something else) that I can use to make this question (only) use the full width of the window? Thanks!

 Can you someone help me set this up? I’m trying to make this nps question 2 with selected brand at question 1. If you pick several options for question 1, only up to 3 can be shown at question2. If you choose BRAND A, make sure it's given priority for display.   question1 I’d appreciate any help, thanks! 

I would have thought this would be a common question as hidden questions are common in other platforms in driving a survey. However, I couldn’t find a post on this so just in case anyone wants to know how to do it in Javascript. Would be useful to know how it is done in Qualtrics without Javascript.     const QB = "${q://QID9/SelectedChoicesRecode}"; //read answers from multiple response question    var result = QB.split(', ');  // convert the string answers into an array where the comma and space is the delimiter eg. “1, 2” into [“1”,”2”]        if (result.includes("1")) //search in the array for code 1    {                          //check the first box in a multiple response                jQuery('input[type="checkbox"]').eq(0).prop('checked',true);            }    if (result.includes("2")) ) //search in the array for code 2    {                          //check the second box in a multiple response                jQuery('input[type="checkbox"]').eq(1).prop('checked',true);        }