Prematurely exiting a Loop and Merge block in Qualtrics

I'm currently working on a Qualtrics survey in which respondents have to solve a long list of anagrams, and then answer some demographic questions.

To make the anagram part easier, I've used a Loop and Merge block: the first field is the anagram to be solved, the second field is the solution of the anagram, and the survey can therefore check the answer of the respondent against the solution for each anagram.

As it is, the survey is working perfectly: however, I'd like to allow respondents to prematurely exit the loop by typing "EXIT" in the response field, and to redirect them to the next question block (the demographic questions).

This is typically something that is achieved using "Skip" logic: however, skipping to the end of the block does not do the trick (the loop restarts). I managed to redirect them to the end of the survey, but not to the demographic question block.

Is there a way to use javascript to jump to the demographic block or exit the loop and merge block prematurely? Am I missing a Qualtrics option that would do the trick?

Solution

If this is still relevant to you: I needed the same functionality and this is how I solved it: First, I define a helper variable, call it EndLoop, which I initialize to 0. Then I set up a function to change the value of EndLoop to 1 after people hit a button, additionally I add a display logic to the question in the loop showing them only if EndLoop is still 0 and hiding the questions as soon as EndLoop is 1.

This is a step-by-step instruction and the javascript and html code.

The bold stuff is what you need to do, the bulletpoints a more detailed instruction how to do it.

1. Before your loop-and-merge define an embedded data field called EndLoop and initialize it as 0.

Go to the Survey Flow Panel
Add a new element > select embedded data field
Name the field 'EndLoop'
Set its value t0 the number 0 by click on the link "set value now"
Make sure you move it before the merge-and-loop block

2. For each item in the loop set a display logic to show them conditional on 'EndLoop' = 0

Go to the options menu of each question in the loop
Select "add display logic"
Select "Embedded Data" from the first dropdown menu
A new type field opens > as name type EndLoop + select "is equal to" + type 0 as value

3. Insert a customized button into the page where people should be able to opt-out. The button runs a user-defined function called setEndLoop() onclick.

Click on the question where the button should appear
On the top-right of the question text select "html view"

The code I used is:

<input id="css-class-mybutton" onclick="setEndLoop()" value=" done " type="button">

If you want to change the button text, change the " done " in value = " done "

4. Define the function setEndLoop() using custom javascript to change the value of EndLoop to 1 and emulate a next button click

Go to the options menu of each question in the loop
Select "add JavaScript"

The code I used is:

    /* Get the EndLoop variable */
    var EndLoop = "${e://Field/EndLoop}";

    Qualtrics.SurveyEngine.addOnload(function(){

        /* hide previous and next button */
        $('NextButton') && $('NextButton').hide();
        $('PreviousButton') && $('PreviousButton').hide();

        /* Function: on click on user-defined button -> change the field EndLoop */
        var that = this;

        setEndLoop = function(){
            Qualtrics.SurveyEngine.setEmbeddedData('EndLoop', 1);
            that.clickNextButton();
        };
    });

The button will not have the default style, thus, define a custom css to style your button to look like the buttons of your theme. The class name for the button I used here is id="css-class-mybutton", use .css-class-mybutton{ ... } in the css.

Hope that helps.