Updated: Rank-Order Carry Forward in Qualtrics with Javascript

This post describes a method to ask future questions using the responses from a rank-order type question in Qualtrics. For example, if you wanted to have a respondent state relative preference between the second and third highest ranks obtained from the rank order.

Normally, to use the responses from a previous question in a subsequent one, the creator of a survey would use the “Carry Forward Items” capability built into Qualtrics. However, you’ll notice that, for some reason, the options are extremely limited as to which you can carry forward. This post describes a way in which you can use javascript to accomplish a similar functionality. It will address questions such as, “how do I carry forward rank-orders in Qualtrics?” or “is there a method to get answers to previous questions using javascript in Qualtrics?”

The basic method involves three parts.

  1. Get the values from the previous question using piped text and store them in a two-dimensional javascript array.
  2. Store the values in embedded data.
  3. Use the embedded data as piped text.

Screen Shot 2015-05-23 at 4.37.39 PMFor this example, I am going to use a rank order with options labeled d, c, b, & a, as you see to the right.

Create embedded data variables

Before you can store the values you are interested as embedded data, you need to create them. Do this from the survey flow.

Screen Shot 2016-03-30 at 12.15.30 PM

Get the values of the rank-order and store them in a two-dimensional javascript array.

This method will work fine for rank-order data because participants cannot write-in any answers. If they could write-in answers, a participant could break the code (i.e. cause the javascript to stop working) if she includes a single or double quotation mark. Additionally, the participant could (potentially) insert her own javascript code, which you could not control. In this case, we do not need to worry about those possibilities because the answers are not write-ins.

Insert a page break after the rank-order. Somewhere after the rank-order question in the survey flow, create a blank “descriptive text” question. From the the sprocket icon below the label for the question, select “Add Javascript” from the pull down menu. Paste the code below.

Qualtrics.SurveyEngine.addOnload(function()
{
	/*Place Your Javascript Below This Line*/
	
	// hide next button
	$('NextButton') && $('NextButton').hide();
	
	// store rank in first column, description in second column of array "choice"
	var choice = [ 
        ['${q://QID1/ChoiceNumericEntryValue/1}','${q://QID1/ChoiceDescription/1}'],
        ['${q://QID1/ChoiceNumericEntryValue/2}','${q://QID1/ChoiceDescription/2}'],
        ['${q://QID1/ChoiceNumericEntryValue/3}','${q://QID1/ChoiceDescription/3}'],
        ['${q://QID1/ChoiceNumericEntryValue/4}','${q://QID1/ChoiceDescription/4}']
    ];

	// sort choice
	// Note: alphabetic sort, so will give problems if >9 items ranked
	choice.sort();
	
	// save description of first and second choice as embedded data
	// Note: you must create these embedded data fields in survey flow for this to work
    // Note: javascript arrays begin at zero, so choice[0][1] 
    //       is the first row, second column of array "choice"
	Qualtrics.SurveyEngine.setEmbeddedData('second',choice[1][1]);
	Qualtrics.SurveyEngine.setEmbeddedData('third',choice[2][1]);

	// advance to next screen
	this.clickNextButton();
	

});

 

Insert a page break after this blank question.

The text “${q://QID1/ChoiceNumericEntryValue/1}” is piped text. Before the page is served to the participant, this text will be replaced by the server, so the javascript code will only see the value (in this case, a number). QID1 indicates that that we want the choice on question 1, the rank-order question. The rest of the line means we want the rank value of the 1st choice.

The code above stores the rank-order of the choices in a multidimensional array in javascript. In this case the array “choice” has 4 rows of two columns. The first column contains all the rank-orders. The second column contains the corresponding answers which were ranked.

Since I stored the ranks in an array with the rank in the first column, I can use the built-in function for javascript arrays to sort. “choice.sort();” calls the sort function and sorts the array such that the lowest number (highest rank) is first. Note that this function will only work if there are fewer than 10 options. This is because the sort function is treating the ranks as strings. In other words, it is sorting them to be in alphabetical order. Alphabetical order of 11 numbers goes 1, 10, 11, 2, 3… If you wish to have more than 9 ranks, you must sort using a different function.

Javascript arrays are called by variable name and numbers indicating the row and column. The first row is row 0 and the first column is column 0. In this case calling the highest ranked option could be done by calling “choice[0][1]”. This means we want the first row and the second column (because the second column contains the actual choice).

Display a choice to the participant based on position in the sorted array.

Anywhere after that question, you can use piped text just as you would normally to display the second and third options.

Screen Shot 2016-03-30 at 12.20.42 PM

13 Comments

  1. Hello, thank you for posting.

    I get this error when I enter script into the multiple choice question text after the ranking question.

    “JavaScript is not allowed in question text. Please add JavaScript using the JavaScript editor.”

    Any ideas?

    Thank you.

  2. Exactly what I needed for my cognitive dissonance experiment!

    May I ask what would be the appropriate code for a ranking list of 9 items, to carry forward fourth and fifth ranked items? I tried to manually add/change those following the same logic, but kept getting a JavaScript error when I tried to save it; and I can’t really see what’s wrong since I have zero prior preference with Java.

    Thank you very much!!!!

  3. by the way, this is the code I tried to put in:

    Qualtrics.SurveyEngine.addOnload(function()
    {
    /*Place Your Javascript Below This Line*/

    // hide next button
    $(‘NextButton’) && $(‘NextButton’).hide();

    // store rank in first column, description in second column of array “choice”
    var choice = [
    [‘${q://QID1/ChoiceNumericEntryValue/1}’,’${q://QID1/ChoiceDescription/1}’],
    [‘${q://QID1/ChoiceNumericEntryValue/2}’,’${q://QID1/ChoiceDescription/2}’],
    [‘${q://QID1/ChoiceNumericEntryValue/3}’,’${q://QID1/ChoiceDescription/3}’],
    [‘${q://QID1/ChoiceNumericEntryValue/4}’,’${q://QID1/ChoiceDescription/4}’],
    [‘${q://QID1/ChoiceNumericEntryValue/5}’,’${q://QID1/ChoiceDescription/5}’],
    [‘${q://QID1/ChoiceNumericEntryValue/6}’,’${q://QID1/ChoiceDescription/7}’],
    [‘${q://QID1/ChoiceNumericEntryValue/8}’,’${q://QID1/ChoiceDescription/9}’]
    ];

    // sort choice
    // Note: alphabetic sort, so will give problems if >9 items ranked
    choice.sort();

    // save description of first and second choice as embedded data
    // Note: you must create these embedded data fields in survey flow for this to work
    // Note: javascript arrays begin at zero, so choice[0][1]
    // is the first row, second column of array “choice”
    Qualtrics.SurveyEngine.setEmbeddedData(‘fourth’,choice[3][1]);
    Qualtrics.SurveyEngine.setEmbeddedData(‘third’,choice[4][1]);

    // advance to next screen
    this.clickNextButton();

    });

    1. It would look something like this. You’ll still need to edit this. You need to make sure you have the right question ID (QID; lines 10-18). You also need to make sure your embedded data variables match what you named them (lines 29 & 30).

       1
       2
       3
       4
       5
       6
       7
       8
       9
      10
      11
      12
      13
      14
      15
      16
      17
      18
      19
      20
      21
      22
      23
      24
      25
      26
      27
      28
      29
      30
      31
      32
      33
      34
      35
      36
      Qualtrics.SurveyEngine.addOnload(function()
      {
      	/*Place Your Javascript Below This Line*/
      	
      	// hide next button
      	$('NextButton') && $('NextButton').hide();
      	
      	// store rank in first column, description in second column of array "choice"
      	var choice = [ 
              ['${q://QID1/ChoiceNumericEntryValue/1}','${q://QID1/ChoiceDescription/1}'],
              ['${q://QID1/ChoiceNumericEntryValue/2}','${q://QID1/ChoiceDescription/2}'],
              ['${q://QID1/ChoiceNumericEntryValue/3}','${q://QID1/ChoiceDescription/3}'],
              ['${q://QID1/ChoiceNumericEntryValue/4}','${q://QID1/ChoiceDescription/4}'],
              ['${q://QID1/ChoiceNumericEntryValue/5}','${q://QID1/ChoiceDescription/5}'],
              ['${q://QID1/ChoiceNumericEntryValue/6}','${q://QID1/ChoiceDescription/6}'],
              ['${q://QID1/ChoiceNumericEntryValue/7}','${q://QID1/ChoiceDescription/7}'],
              ['${q://QID1/ChoiceNumericEntryValue/8}','${q://QID1/ChoiceDescription/8}'],
              ['${q://QID1/ChoiceNumericEntryValue/9}','${q://QID1/ChoiceDescription/9}']
          ];
      
      	// sort choice
      	// Note: alphabetic sort, so will give problems if >9 items ranked
      	choice.sort();
      	
      	// save description of first and second choice as embedded data
      	// Note: you must create these embedded data fields in survey flow for this to work
          // Note: javascript arrays begin at zero, so choice[0][1] 
          //       is the first row, second column of array "choice"
      	Qualtrics.SurveyEngine.setEmbeddedData('fourth',choice[3][1]);
      	Qualtrics.SurveyEngine.setEmbeddedData('fifth',choice[4][1]);
      
      	// advance to next screen
      	this.clickNextButton();
      	
      
      });
      
  4. Hi Kurt, Thank you for this informative article.
    Do you know how to set default answers using piped values in a Rank question type?

    1. Hi CW. Maybe I’m not really sure what you’re asking. You can set default answers in a rank question type using built-in functionality (no javascript needed).

      1. The built-in functionality only allows entering a fixed value (cannot enter a piped value). I was hoping the default rank will change based on answers to a previous question. Thank you and any help appreciated!

        1. Ah. So, an individual-level default order? The code above can do that. Rather than create embedded variables for “second” and “third” as I did in the example, create as many as you have options to rank. So if you have five options, you’d create five embedded data variables (“first” “second” “third” “fourth” “fifth”) and modify the javascript to be:

          Qualtrics.SurveyEngine.setEmbeddedData(‘first’,choice[0][1]);
          Qualtrics.SurveyEngine.setEmbeddedData(‘second’,choice[1][1]);
          Qualtrics.SurveyEngine.setEmbeddedData(‘third’,choice[2][1]);
          Qualtrics.SurveyEngine.setEmbeddedData(‘fourth’,choice[3][1]);
          Qualtrics.SurveyEngine.setEmbeddedData(‘fifth’,choice[4][1]);

          You then use piped text to bring these into your second rank-order type question. For example, you first option in the rank would be ${e://Field/first}. The second option would be ${e://Field/second}, etc.

          1. Thanks again for the quick reply! Where I was stuck on was the step of setting the default. The built-in doesn’t allow piped text (otherwise your code here would be perfectly what I needed!). Any tips on how to use Javascript to set default? I have tried using setChoiceValue but have not found the correct way to do that.

  5. Thank you so much for this script. I’ve been playing around with options for a while now and was just getting frustrated. I knew there had to be a fairly simple answer out there, I just couldn’t discover it on my own. Have already modified this to fit other needs, too. Much appreciated!

Leave a Reply

Your email address will not be published. Required fields are marked *