Custom Code

Hello all, I am working with a matrix question type and ran into a problem of unequal spacing between response options (see the pic below). How do I make the space between all response options to be the same? Thank you very much in advance. !

2584

7 years ago

cqzc110

Custom Code

Drag and Drop Box Droppable Height

I am trying to increase the sizeof dropable region of the drag and drop box. I tried the following command, .Skin .PGR .DragAndDrop td.groupsContainerTd div > div { height: 700px; } This command does increase the drag and drop box. However, the increased region is not effective for dropping. The only region allowing for drag and drop is still the same as before, though the size of the box seems to be larger.

Move grid lines value closer to slider

Hi Qualtrics community? Does anyone know if custom code that enables you to move the grid line values in a slider question closer to the slider itself? I find it so funny that the grid line values are so far away from the actual slider. Thanks! !

Add 2 custom buttons in a question

Hello! I'm new to Qualtrics so here is my newbie question :) At the start of my survey I want to add an age verification question so the respondents can answer "Agree" or "Disagree". Now, I would like that the 2 answers are 2 buttons they can click on. A button looks more professional. They need to click Agree to be able to move to the next page where the survey starts. If they click Disagree, the survey has ended. Can anyone please help me out? Thank you!

2430

7 years ago

lejoshuaLevel 1 ●

Custom Code

storing the text written by a survey taker in a text entry box in embedded data with Javascript

I am working on the survey that you can preview here: https://wharton.ca1.qualtrics.com/jfe/preview/SV_ekAwRhlPI3HGfNH?Q_SurveyVersionID=current&Q_CHL=preview I am trying to save the text entry responses to embedded data. I have named the fields earlier (est1 and est2) in the survey flow so Javascript recognizes and fills them, and am using this function: Qualtrics.SurveyEngine.setEmbeddedData('est1', "?") But basically, I don't know what to put as the question mark, or how to create a variable that I can refer to instead of that question mark. I have been searching for many hours online but i expect my question is too basic for anyone even to have had to ask it before... any help would be very appreciated. Josh

Multiple Select Answers in Drop Down Box (see attachment)

Hello, I would appreciate some help with a question that is separated into two parts. The first part asks a respondent to list the nicknames of his/her sexual partners over the past 12 months The names produced are "Carry Forward" to a next question asking the respondent specific questions about each partner. I used a matrix table (please, see attachment) to organize the questions in the columns, and the names of the partners in the rows. Now, some questions (such as the type of sexual relations can have multiple answers). I can use the "Multiple Answer" column option to display these answers, but I would rather use the dropdown to save space. I would appreciate some assistance in designing this. thanks - PS

JQuery does not load the calendar in a loop and merge block after the first block

Hello, I am trying to implement the jQuery datepicker in a loop and merge block. It works fine for the first loop but after that, the calendar does not show up when I click on the text field for entering a date. I notice that this also happens when hitting the back button after selecting a date. Is this an issue with the Qualtrics survey engine or jQuery itself? Here is the code that I am currently using (credit to @fleb): ``` <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title> Datepicker</title> <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <link rel="stylesheet" href="/resources/demos/style.css"> <script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> <script> $( function() { $( "#datepicker" ).datepicker({

How can I save the final value of a slider to an embedded data field?

Hi all, I have the following javascript to display an adjustable (via sliders) chart below. I'm trying to capture the final slider value of the red variable. However, no matter where I put "Qualtrics.SurveyEngine.setEmbeddedData("R_LR_HR_10_50adjusted", finalposition)" it just saves the original position, or nothing at all in the output csv. Any help would be very much appreciated! Best, Chris Qualtrics.SurveyEngine.addOnload(function() { Chart.defaults.global = { animation: true, animationSteps: 60, animationEasing: "easeOutQuart", showScale: true, scaleOverride: false, scaleSteps: null, scaleStepWidth: null, scaleStartValue: null, scaleLineColor: "rgba(0,0,0,.1)", scaleLineWidth: 1, scaleShowLabels: true, scaleLabel: "<%=value%>", scaleIntegersOnly: true, scaleBeginAtZero: false, scaleFontFamily: "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif", scaleFontSize: 12, scaleFontStyle: "normal", scaleFontColor: "#666", responsive: fal

I have a field for entering a name. Is there javascript (or other means) of capitalising the first letters of the name?

Changing the colour of drop-down menu answers

Hi all. I'm trying to change the text colour of all answers to white. I've used some CSS code in the 'Look and Feel' - 'Style' box to achieve this. It has worked for everything in my survey except pull-down menus, which remain grey, and difficult to see in my survey colour scheme. Any idea on how to change this? Here's my current code: .Skin, #SurveyEngineBody { background:#0A72BA!important; } .LabelWrapper, .QuestionText, .SubQuestionText, .AnswerText{ color:white!important; } .Skin .InputText, input[type=text] { background-color : #004474 !important; border-radius: 2px !important; border: solid 1px #004474 !important; color:white!important; } Also hoping to change the colour scheme of the progress bar - is this possible? Thanks in advance.

Fixing JS on slider questions to reformat respondents' response summary

I added the following JS to my slider questions, which moved the slider labels to be placed below the slider. However, it totally messed up my response summary (the summary that respondents get of their own responses before submitting the survey). {jQuery("ul.labels").insertAfter("div.slider-container:last");} Basically the problem is that now that in the respondent's response summary, the slider questions are all clumped together, and the labels are all clumped together at the bottom (aka the labels are detached from the sliders!). Does anyone have any guidance here?

set embedded data from this.questionId SelectedChoicesRecode

Hi Qualtrics Community! I am trying to use javascript to write a value to embedded data based on the current questions Recoded Values. I know how to do this if the QuestionID is known, but I don't know how to string the code toegether to refer to this.questionId (I'd like to use the same javascript for a large number of questions without modifying it to refer to the specific question IDs). The functionality I am looking for is essentially "If this.questionId's SelectedChoicesRecode = 1 then set embedded data "c" = 1, else "c" = 0. Any pointers are appreciated! G2000

Embedded youtube videos - play only once, no related videos

I wonder if anyone might be able to help me with a bit of coding? I am trying to find a way to make a URL for an embedded youtube video where it doesn't 'show related videos' at the end of the video, AND you can only play the video once. There are some bits under the 'embed / more' thingy on youtube' where you can do one or the other, but not both! Do you have any thoughts? Google is not being massively helpful.

salimlkoLevel 1 ●

We are trying to implement a youtube video link, and used below code. Here we need that the title info bar appearing on the video should be removed, we have used "&showinfo=0" parameter but it's not working. Could you please provide us any solution on this? <iframe width="640" height="480" src="https://www.youtube.com/embed/VrZINs2rdnM?rel=0&autoplay=1&feature=oembed&showinfo=0" frameborder="0" allow="autoplay; encrypted-media"></iframe>

Facebook Messenger Bot script

Hi, we wish to include a Facebook Messenger Bot script within a question in our survey but after inserting the script into the question's HTML view, we have mixed results - several times the FB messenger button has displayed correctly on the survey page, other times it doesn't appear at all, and often when re-opening the HTML view to check the script, it has vanished. The script we have is: <script> window.fbMessengerPlugins = window.fbMessengerPlugins || { init : function() { FB.init({ appId: "<OUR APP ID>", xfbml: true, version: "v3.0" }); }, callable : [] }; window.fbAsyncInit = window.fbAsyncInit || function() { window.fbMessengerPlugins.callable.forEach( function( item ) { item(); } ); window.fbMessengerPlugins.init(); }; setTimeout( function() { (function(d, s, id){ var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) { return; } js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/en_US/sdk.js"; fjs.parentNode.insertBefore(js, fjs)

Why does my html code disappear under certain themes?

I prepared a question using html and javascript, but unless I use the default theme, the radio buttons that I created in html disappear. Is this normal? Is there a way around it?

Remove null value from a number array

Hello, I created a number array as follows: Qualtrics.SurveyEngine.addOnReady(function() { var i1=parseInt("${q://QID1/ChoiceTextEntryValue}"); var i2=parseInt("${q://QID2/ChoiceTextEntryValue}"); var i3=parseInt("${q://QID3/ChoiceTextEntryValue}"); var myArray = [i1, i2, i3]; And I want to randomly select one of these items in the array, so I write: var randomItem = myArray[Math.floor(Math.random() * myArray.length)]; But the problem is, if one of the three items is null (a respondent skill the question), this does not work. Could you please tell me how I can remove null item in the array? Thank you very much.

Added script to header to change CSS based on embedded data: not working

I've added some custom code to my survey header to apply certain CSS if an embedded data field = 1, but it isn't working. Does anyone have any advice? My code is attached in a .txt file.

How can I add a timeout message for individual questions?

I have a serious of questions that are all presented on different pages. On each page, I have also added a "Timing" item to display a countdown clock. If the countdown clock reaches zero, I want an error message to pop up. Currently I am using the following code for each Question Javascript to show an error message after 4 seconds: Qualtrics.SurveyEngine.addOnload(function() { /*Place your JavaScript here to run when the page loads*/ }); Qualtrics.SurveyEngine.addOnReady(function() { setTimeout(function(){ alert("Time is up. Please choose an answer and move to the next question."); }, 4000); }); Qualtrics.SurveyEngine.addOnUnload(function() { /*Place your JavaScript here to run when the page loads*/ }); This code displays an error message after 4 seconds if I stay on a question. However, if I advance quicker than 4 seconds, the timeout error message carries over and will appear in the middle of the countdown on the next page (e.g., If I advance after 3 seconds, the next que

Move previous/next buttons to top AND bottom of page

Hi all, I would like to have previous/next buttons at the top AND bottom of the page. I have found out how to place the navigation buttons to the top of the page (see previous post) by placing the following code in the header CSS <script type="text/javascript"> Qualtrics.SurveyEngine.addOnReady(function() { $(''Header').insert($('Buttons')); }); </script> I tried to place them in the footer, by putting following code in the footer: <script type="text/javascript"> Qualtrics.SurveyEngine.addOnReady(function() { $('Footer').insert($('Buttons')); }); </script> This then however removes the buttons from the header again.... Anyone who can crack this? Best, Kars

Formatting styles within matrix tables

Is there a way to change the size (e.g. to 12px) of ALL statement and scale point options in all matrix tables throughout a survey? Thanks.

Javascript to filter values from embedded field and then select random item

Kia ora koutou, hello everyone! I have an embedded field 'colour_selection' which is populated with answers from a multiple answer questions in the survey flow. I would like to use Javascript to filter out specific answers, and then from the filtered list take a random answer to store back in to an embedded field to pipe in to a following question. (I would have loved to do this using a loop and merge, but it seems like it's not possible to exclude answers easily). I have limited Javascript ability, but have managed to get this code to work fine here https://jsfiddle.net/1etL6axn/ However when I try to run this in Qualtrics I'm getting a console error "colourSelection.filter is not a function". I get an "access denied" error when I try to post code here, so here is a screenshot. And I've attached the qsf. ! Is this a limitation within Qualtrics? Should I try to find a solution using JQuery instead? Have I missed something unique to Qualtrics to make this work? Thanks in advance

Scrolling Fixed Pane in Rank Order Quesion

I have a rank-order question with 20 items in it. I am asking participants to rank-order the 20 items by similarity to a reference design at the top of the page (in the question text). The issue I am having is that they cannot see the reference design and the designs at the bottom of the list at the same time due to the length of the list. Is there a way to make a "frozen pane" with the question text and have the 20 ranking items in a scrolling list underneath in order to see the reference design at all times?

Hiding withdraw/exit survey button (footer) from select Qualtrics pages using Javascript

Hi everyone- I'm looking for a way to hide a Qualtrics footer (which is set up to function as an 'I would like to exit this survey' button) on select pages. For background, the footer is using the following code (found on one of these discussion threads I believe, and without the # symbols): <#button id= "EndNow" name="EndNowBtn" title="EndNow" type="button">I would like to exit this survey#</button> I'm getting the button to work as I would like by adding questions at the end of pages that are hidden by Javascript (found on the same thread): Qualtrics.SurveyEngine.addOnReady(function() { $(this.question._$separator).hide(); $(this.questionId).hide(); var that = this; var endBtn = document.getElementById("EndNow"); function skip() { that.setChoiceValue(1, true); that.clickNextButton(); }; endBtn.addEventListener("click", skip); }); I'm using an 'End of Block' Skip Logic on these questions and directing to customised End of Survey messages through the Survey

Add button that extracts time stamps from audio

I want to add an audio clip that participants are required to listen to. While listening to the audio clip, participants are supposed to prove that they are listening by pressing a button (or perhaps some more straightforward input paradigm) whenever they hear the word "dog." In the backend, I want to extract the total number of times the button was pressed, and the time stamps that corresponded to the button presses. I've been having trouble designing the least confusing set-up. The button should only be active while the audio clip is playing. At the same time, if the user "accidentally" presses the button when they didn't intend to, I want to allow them to re-do the whole process. What is the best way to set this up?

705

7 years ago

Motivational Playlist

Sign up

Login to the Community