Help with word search data

Thank you in advance!

Here are some images of the actual code

Hi - are you able to paste the code into your post rather than the images?

Hi, I've seen that code before and have tackled a similar post before but it looks like it got lost in the migration. @JoseS could you see if that post can be recovered?

Below is the working example. It is working with a Timing question on the same page on my end.

First, create the Embedded Data fields of "wordsFound" and "timingWordsFound" and put them at the top of the Survey Flow.

Next, add the below to the survey's Header:

<script src="https://cdn.jsdelivr.net/gh/QuentinAndre/WordSearchJS/lib/wordsearch.min.js"></script>

In the Builder, create a Text/Graphic question and use the Rich Content Editor's HTML/Source “<>” view to update the question text with the below:

<div id="mysearchtask">&nbsp;</div>
Click to write question text

Finally, update the question's JavaScript with the below in the OnReady section:

var countrygrid = [
    ['A', 'I', 'V', 'T', 'A', 'L', 'N', 'I', 'E', 'T', 'S', 'N', 'E', 'T', 'H', 'C', 'E', 'I', 'L'],
    ['G', 'N', 'E', 'T', 'H', 'E', 'R', 'L', 'A', 'N', 'D', 'S', 'N', 'P', 'V', 'A', 'A', 'P', 'D'],
    ['R', 'O', 'M', 'A', 'N', 'I', 'A', 'T', 'V', 'I', 'S', 'R', 'O', 'I', 'I', 'I', 'O', 'C', 'B'],
    ['U', 'T', 'E', 'J', 'V', 'I', 'E', 'T', 'Y', 'C', 'N', 'L', 'E', 'R', 'A', 'R', 'I', 'D', 'I'],
    ['O', 'V', 'P', 'M', 'J', 'J', 'S', 'C', 'O', 'B', 'A', 'A', 'T', 'C', 'T', 'P', 'N', 'E', 'G'],
    ['B', 'E', 'C', 'I', 'V', 'E', 'S', 'T', 'N', 'N', 'T', 'S', 'U', 'U', 'E', 'A', 'S', 'V', 'Y'],
    ['M', 'A', 'E', 'I', 'K', 'A', 'L', 'L', 'D', 'A', 'U', 'W', 'G', 'H', 'L', 'E', 'X', 'C', 'A'],
    ['E', 'G', 'J', 'N', 'L', 'A', 'T', 'V', 'O', 'A', 'R', 'A', 'B', 'R', 'T', 'B', 'R', 'Z', 'W'],
    ['X', 'E', 'J', 'W', 'N', 'B', 'S', 'L', 'E', 'V', 'L', 'F', 'E', 'N', 'U', 'I', 'V', 'G', 'R'],
    ['U', 'Y', 'P', 'D', 'I', 'V', 'U', 'S', 'A', 'E', 'A', 'Z', 'L', 'L', 'R', 'L', 'L', 'S', 'O'],
    ['L', 'R', 'R', 'M', 'A', 'C', 'T', 'P', 'N', 'M', 'T', 'K', 'G', 'T', 'N', 'V', 'P', 'N', 'N'],
    ['I', 'A', 'A', 'N', 'A', 'O', 'E', 'I', 'E', 'I', 'Y', 'A', 'I', 'J', 'N', 'S', 'K', 'D', 'J'],
    ['L', 'G', 'N', 'I', 'N', 'C', 'A', 'L', 'W', 'R', 'R', 'H', 'U', 'A', 'E', 'D', 'R', 'N', 'D'],
    ['I', 'N', 'I', 'I', 'T', 'R', 'E', 'S', 'A', 'I', 'H', 'V', 'M', 'L', 'J', 'N', 'A', 'A', 'J'],
    ['N', 'U', 'A', 'V', 'K', 'A', 'A', 'D', 'A', 'N', 'P', 'C', 'A', 'O', 'V', 'A', 'M', 'L', 'Y'],
    ['U', 'H', 'Z', 'U', 'V', 'J', 'O', 'G', 'O', 'R', 'D', 'W', 'E', 'V', 'J', 'L', 'N', 'G', 'L'],
    ['N', 'E', 'D', 'E', 'W', 'S', 'B', 'R', 'N', 'N', 'U', 'V', 'J', 'Z', 'T', 'E', 'E', 'N', 'A'],
    ['D', 'S', 'U', 'R', 'A', 'L', 'E', 'B', 'C', 'T', 'I', 'I', 'G', 'I', 'C', 'R', 'D', 'E', 'T'],
    ['D', 'N', 'A', 'L', 'N', 'I', 'F', 'G', 'E', 'R', 'M', 'A', 'N', 'Y', 'W', 'I', 'M', 'E', 'I']];

var countrynames = ['AUSTRIA', 'BELARUS', 'BELGIUM', 'BULGARIA', 'CROATIA', 'CZECHREPUBLIC', 'DENMARK', 'ENGLAND', 'ESTONIA',
    'FINLAND', 'FRANCE', 'GERMANY', 'GREECE', 'HUNGARY', 'ICELAND', 'IRELAND', 'ITALY', 'LATVIA', 'LIECHTENSTEIN',
    'LITHUANIA', 'LUXEMBOURG', 'MACEDONIA', 'MALTA', 'NETHERLANDS', 'NORWAY', 'POLAND', 'PORTUGAL', 'ROMANIA',
    'SCOTLAND', 'SLOVAKIA', 'SPAIN', 'SWEDEN', 'SWITZERLAND', 'UKRAINE', 'WALES'];

function getRandom(arr, n) {
    var result = new Array(n),
        len = arr.length,
        taken = new Array(len);
    if (n > len)
        throw new RangeError("getRandom: more elements taken than available");
    while (n--) {
        var x = Math.floor(Math.random() * len);
        result[n] = arr[x in taken ? taken[x] : x];
        taken[x] = --len in taken ? taken[len] : len;
    }
    return result;
}

var wordnames = getRandom(countrynames, 5)

function storeScoreAndTimingInQualtrics() {
    var score = this.getScore();
    var timing = this.getTiming();
    var timing_str = timing.join(",") // Convert the timings separated by commas to a string
    Qualtrics.SurveyEngine.setEmbeddedData("wordsFound", score);
    Qualtrics.SurveyEngine.setEmbeddedData("timingWordsFound", timing_str);
}

ws = new WordSearch({
        "grid": countrygrid, // Your grid to search
        "words": wordnames, // The list of words to find
        "parentId": "mysearchtask",
        "onFindWord": storeScoreAndTimingInQualtrics // When a word is found...
    });

As requested, here is the actual coding:

Qualtrics.SurveyEngine.addOnload(function()
{
    /*Place your JavaScript here to run when the page loads*/

});

Qualtrics.SurveyEngine.addOnReady(function()
{
    var countrygrid = [
    ['A', 'I', 'V', 'T', 'A', 'L', 'N', 'I', 'E', 'T', 'S', 'G', 'A', 'T', 'H', 'C', 'E', 'I', 'L'],
    ['G', 'A', 'C', 'H', 'I', 'E', 'V', 'E', 'A', 'N', 'D', 'S', 'N', 'T', 'V', 'A', 'A', 'P', 'W'],
    ['A', 'C', 'C', 'O', 'M', 'P', 'L', 'I', 'S', 'H', 'S', 'R', 'O', 'R', 'I', 'I', 'O', 'C', 'I'],
    ['S', 'T', 'E', 'J', 'V', 'U', 'E', 'T', 'Y', 'C', 'N', 'L', 'E', 'I', 'A', 'R', 'I', 'D', 'N'],
    ['O', 'U', 'P', 'M', 'J', 'J', 'L', 'C', 'O', 'B', 'A', 'A', 'T', 'U', 'T', 'P', 'N', 'E', 'N'],
    ['B', 'E', 'C', 'I', 'V', 'E', 'S', 'C', 'N', 'N', 'T', 'N', 'U', 'M', 'E', 'A', 'S', 'V', 'E'],
    ['M', 'A', 'E', 'C', 'K', 'A', 'L', 'L', 'E', 'A', 'U', 'W', 'G', 'P', 'L', 'E', 'X', 'C', 'R'],
    ['E', 'G', 'J', 'N', 'E', 'A', 'T', 'V', 'O', 'A', 'R', 'A', 'B', 'H', 'T', 'B', 'R', 'Z', 'W'],
    ['X', 'E', 'J', 'W', 'N', 'S', 'S', 'L', 'S', 'V', 'L', 'F', 'S', 'C', 'O', 'R', 'E', 'G', 'R'],
    ['U', 'Y', 'P', 'D', 'I', 'V', 'S', 'S', 'A', 'S', 'A', 'Z', 'L', 'L', 'R', 'L', 'L', 'S', 'O'],
    ['L', 'R', 'R', 'M', 'A', 'C', 'T', 'P', 'S', 'M', 'T', 'K', 'G', 'T', 'N', 'V', 'P', 'N', 'N'],
    ['I', 'A', 'C', 'H', 'A', 'M', 'P', 'I', 'O', 'N', 'Y', 'A', 'I', 'J', 'N', 'S', 'K', 'D', 'J'],
    ['V', 'G', 'N', 'I', 'N', 'O', 'O', 'K', 'W', 'R', 'R', 'H', 'U', 'A', 'E', 'D', 'R', 'N', 'D'],
    ['I', 'N', 'I', 'I', 'T', 'R', 'E', 'P', 'R', 'E', 'V', 'A', 'I', 'L', 'J', 'N', 'A', 'A', 'J'],
    ['C', 'U', 'A', 'V', 'K', 'A', 'A', 'T', 'A', 'G', 'P', 'C', 'A', 'O', 'H', 'I', 'M', 'L', 'F'],
    ['T', 'H', 'Z', 'U', 'V', 'J', 'O', 'G', 'O', 'V', 'E', 'R', 'C', 'O', 'M', 'E', 'N', 'G', 'O'],
    ['O', 'E', 'D', 'E', 'C', 'S', 'B', 'R', 'N', 'N', 'U', 'V', 'J', 'Z', 'T', 'E', 'E', 'N', 'R'],
    ['R', 'S', 'U', 'R', 'A', 'L', 'E', 'B', 'C', 'T', 'I', 'I', 'G', 'I', 'C', 'B', 'E', 'S', 'T'],
    ['Y', 'N', 'A', 'I', 'T', 'I', 'F', 'A', 'T', 'T', 'A', 'I', 'N', 'Y', 'W', 'I', 'M', 'E', 'I']];
    
    var keywords = ['ACCOMPLISH', 'ACHIEVE', 'ATTAIN', 'BEST', 'CHAMPION', 'OVERCOME', 'PREVAIL', 'SCORE', 'SUCCESS',
    'TRIUMPH', 'CAN', 'VICTORY', 'WINNER', 'ON', 'HIM', 'NOOK', 'IT', 'TAG',
    'FOR'];

function getRandom(arr, n) {
    var result = new Array(n),
        len = arr.length,
        taken = new Array(len);
    if (n > len)
        throw new RangeError("getRandom: more elements taken than available");
    while (n--) {
        var x = Math.floor(Math.random() * len);
        result[n] = arr[x in taken ? taken[x] : x];
        taken[x] = --len in taken ? taken[len] : len;
    }
    return result;
}

var wordnames = getRandom(keywords, 19)

function storeScoreAndTimingInQualtrics() {
    var score = this.getScore();
    var timing = this.getTiming();
    var timing_str = timing.join(",") // Convert the timings separated by commas to a string
    Qualtrics.SurveyEngine.setEmbeddedData("wordsFound", score);
    Qualtrics.SurveyEngine.setEmbeddedData("timingWordsFound", timing_str);
}

ws = new WordSearch({
        "grid": countrygrid, // Your grid to search
        "words": wordnames, // The list of words to find
        "parentId": "mysearchtask",
        "onFindWord": storeScoreAndTimingInQualtrics // When a word is found...
    });

});

Qualtrics.SurveyEngine.addOnUnload(function()
{
    /*Place your JavaScript here to run when the page is unloaded*/

});

<script src="https://cdn.jsdelivr.net/gh/QuentinAndre/WordSearchJS/lib/wordsearch.min.js"></script>

<div id="mysearchtask">&nbsp;</div>
Click to write question text

var countrygrid = [
    ['A', 'I', 'V', 'T', 'A', 'L', 'N', 'I', 'E', 'T', 'S', 'N', 'E', 'T', 'H', 'C', 'E', 'I', 'L'],
    ['G', 'N', 'E', 'T', 'H', 'E', 'R', 'L', 'A', 'N', 'D', 'S', 'N', 'P', 'V', 'A', 'A', 'P', 'D'],
    ['R', 'O', 'M', 'A', 'N', 'I', 'A', 'T', 'V', 'I', 'S', 'R', 'O', 'I', 'I', 'I', 'O', 'C', 'B'],
    ['U', 'T', 'E', 'J', 'V', 'I', 'E', 'T', 'Y', 'C', 'N', 'L', 'E', 'R', 'A', 'R', 'I', 'D', 'I'],
    ['O', 'V', 'P', 'M', 'J', 'J', 'S', 'C', 'O', 'B', 'A', 'A', 'T', 'C', 'T', 'P', 'N', 'E', 'G'],
    ['B', 'E', 'C', 'I', 'V', 'E', 'S', 'T', 'N', 'N', 'T', 'S', 'U', 'U', 'E', 'A', 'S', 'V', 'Y'],
    ['M', 'A', 'E', 'I', 'K', 'A', 'L', 'L', 'D', 'A', 'U', 'W', 'G', 'H', 'L', 'E', 'X', 'C', 'A'],
    ['E', 'G', 'J', 'N', 'L', 'A', 'T', 'V', 'O', 'A', 'R', 'A', 'B', 'R', 'T', 'B', 'R', 'Z', 'W'],
    ['X', 'E', 'J', 'W', 'N', 'B', 'S', 'L', 'E', 'V', 'L', 'F', 'E', 'N', 'U', 'I', 'V', 'G', 'R'],
    ['U', 'Y', 'P', 'D', 'I', 'V', 'U', 'S', 'A', 'E', 'A', 'Z', 'L', 'L', 'R', 'L', 'L', 'S', 'O'],
    ['L', 'R', 'R', 'M', 'A', 'C', 'T', 'P', 'N', 'M', 'T', 'K', 'G', 'T', 'N', 'V', 'P', 'N', 'N'],
    ['I', 'A', 'A', 'N', 'A', 'O', 'E', 'I', 'E', 'I', 'Y', 'A', 'I', 'J', 'N', 'S', 'K', 'D', 'J'],
    ['L', 'G', 'N', 'I', 'N', 'C', 'A', 'L', 'W', 'R', 'R', 'H', 'U', 'A', 'E', 'D', 'R', 'N', 'D'],
    ['I', 'N', 'I', 'I', 'T', 'R', 'E', 'S', 'A', 'I', 'H', 'V', 'M', 'L', 'J', 'N', 'A', 'A', 'J'],
    ['N', 'U', 'A', 'V', 'K', 'A', 'A', 'D', 'A', 'N', 'P', 'C', 'A', 'O', 'V', 'A', 'M', 'L', 'Y'],
    ['U', 'H', 'Z', 'U', 'V', 'J', 'O', 'G', 'O', 'R', 'D', 'W', 'E', 'V', 'J', 'L', 'N', 'G', 'L'],
    ['N', 'E', 'D', 'E', 'W', 'S', 'B', 'R', 'N', 'N', 'U', 'V', 'J', 'Z', 'T', 'E', 'E', 'N', 'A'],
    ['D', 'S', 'U', 'R', 'A', 'L', 'E', 'B', 'C', 'T', 'I', 'I', 'G', 'I', 'C', 'R', 'D', 'E', 'T'],
    ['D', 'N', 'A', 'L', 'N', 'I', 'F', 'G', 'E', 'R', 'M', 'A', 'N', 'Y', 'W', 'I', 'M', 'E', 'I']];

var countrynames = ['AUSTRIA', 'BELARUS', 'BELGIUM', 'BULGARIA', 'CROATIA', 'CZECHREPUBLIC', 'DENMARK', 'ENGLAND', 'ESTONIA',
    'FINLAND', 'FRANCE', 'GERMANY', 'GREECE', 'HUNGARY', 'ICELAND', 'IRELAND', 'ITALY', 'LATVIA', 'LIECHTENSTEIN',
    'LITHUANIA', 'LUXEMBOURG', 'MACEDONIA', 'MALTA', 'NETHERLANDS', 'NORWAY', 'POLAND', 'PORTUGAL', 'ROMANIA',
    'SCOTLAND', 'SLOVAKIA', 'SPAIN', 'SWEDEN', 'SWITZERLAND', 'UKRAINE', 'WALES'];

function getRandom(arr, n) {
    var result = new Array(n),
        len = arr.length,
        taken = new Array(len);
    if (n > len)
        throw new RangeError("getRandom: more elements taken than available");
    while (n--) {
        var x = Math.floor(Math.random() * len);
        result[n] = arr[x in taken ? taken[x] : x];
        taken[x] = --len in taken ? taken[len] : len;
    }
    return result;
}

var wordnames = getRandom(countrynames, 5)

function storeScoreAndTimingInQualtrics() {
    var score = this.getScore();
    var timing = this.getTiming();
    var timing_str = timing.join(",") // Convert the timings separated by commas to a string
    Qualtrics.SurveyEngine.setEmbeddedData("wordsFound", score);
    Qualtrics.SurveyEngine.setEmbeddedData("timingWordsFound", timing_str);
}

ws = new WordSearch({
        "grid": countrygrid, // Your grid to search
        "words": wordnames, // The list of words to find
        "parentId": "mysearchtask",
        "onFindWord": storeScoreAndTimingInQualtrics // When a word is found...
    });

Hi Tom, and thanks for your response. I have forgot to mention I did include in the survey flow, however it isn’t located at the way top. It is at the block where the word search takes place:

The Survey Flow should look like this:

Maybe it is a bit confusing. The code works perfectly fine in terms of functioning during the survey, however, when I go to the results section of the survey, I expected to be able to see the participants scores in the word search, however, all I have found is:

In your survey Flow, you have included JavaScript in the Embedded Data field name. This will be blank because it is not being set with any values.

You will want to create the fields of “wordsFound” and “timingWordsFound” so that the JavaScript function “Qualtrics.SurveyEngine.setEmbeddedData” can update those fields with the value of the JavaScript variables “score” and “timing_str”

The Survey Flow should look like this:

 

Oh I see, is there a way for you to show me how you’ve got yours entered like this?

Sorry I have never once coded, so I am quite lost!

So if I simply add an embedded data block, include ‘wordsFound’ and ‘timingWordsFound’ without adding anything else and apply this, they should appear in the results section as the found words and timing words found?

Am I understanding this correctly?

Thank you so much for your help and patience!

Does this look about right?

If it the Element is before the Block that contains the WordSearch question (top of the flow), then yes. When a word is found, this function runs:

function storeScoreAndTimingInQualtrics() {
    var score = this.getScore();
    var timing = this.getTiming();
    var timing_str = timing.join(",") // Convert the timings separated by commas to a string
    Qualtrics.SurveyEngine.setEmbeddedData("wordsFound", score);
    Qualtrics.SurveyEngine.setEmbeddedData("timingWordsFound", timing_str);
}

It creates JavaScript variables that get the score and timing data, then via “Qualtrics.SurveyEngine.setEmbeddedData”, those values are stored in the Qualtrics Embedded Data fields.

Your Survey Flow looks good now. Be sure to re-Publish the survey.

Tom! You’re an absolute legend. Thank you so much for your help! I am extremely grateful!