Make typed words disappear within a text-box with enter/return key press | XM Community
Skip to main content

Hello,
I would like to create a text-box where the inputted text 'disappears' from the participant's screen when the enter key is pressed, but have it so the text that has disappeared from the screen is also saved as data of some variety. Ideally, the data would be saved as a word-list seperated by spaces or commas.
For context, this is for a word association task where the participant is asked to type as many words related to something as they can in 5 minutes. So the participant is expected to type a word, press the enter key (to have the word disappear from the screen and have it stored as data) and repeat this action several times over. It is necessary for the association task that the words both disappear from the text-box and are all stored as data when the participants press the enter key.
I attempted a suggestion from a previous thread but the final javascript solution (which saved the disappeared text into embedded data) would overwrite the 'disappeared' text so that instead of a list of all words entered into the text-box, only the word that the participant entered last would be stored within the embedded data.
Any help on this issue would be greatly appreciated!

Hi there, I tackled something similar recently in this thread but it used space bar to register the words. Adapted for your question, where Enter registers the words and space bar is disabled, try using the below.
First create an Embedded Data field called "words" and put it at the top of the Survey Flow. This field will get updated each time Enter is pressed.
Then, create a Text/Graphic question and use the Rich Content Editor's HTML/Source view "<>" to update the Question Text with the below:




Press Enter to register words.
Finally, add the below to the question's JavaScript in the OnReady section:
const words = [];

const memorizer = (ev) => {
  const inp = ev.target;
  const val = inp.value.trim();

  if(ev.key === 'Enter') {
    const valSpl = val.split(',');
    words.push(valSpl(0]);
    inp.value = valSpl 1] || '';
  }

console.clear();console.log(words);

Qualtrics.SurveyEngine.setEmbeddedData("words", words);

}

jQuery('#myInput').keydown(function(e) {
                if (event.key === ' ') {
                    return false;
                }    
            });

document.querySelector('#myInput').addEventListener('keyup', memorizer);

Tom_1842
Hello, this is very close to solving my problem!
Although, the data saved within the embedded 'words' variable only seems to record the first-inputted word. That is, only the word that the participant first types into the text-box and then presses the enter key afterward. All other words typed after the first word is enterred into the text-box do not seem to be recorded within the 'words' variable.
Otherwise, everything else about your provided solution works perfectly.
Is there any way to have it so every word enterred into the text-box is saved within the 'words' embedded data. That is, the participant would type 'one', hit ENTER, then type 'two', hit ENTER and so forth. Then within the 'words' data, the response will be stored as 'one two three ...'.

j_greenan I was able to confirm that although "words" was displaying the full array of words when used as Piped Text later in the survey, nothing was appearing in the response view and only 1 word was included in data download.
wordenter1.pngI've seen something like this before and the following works to resolve it. In the Survey Flow after the block with the word entry question, update the Embedded Data field of "words" with itself, like in the below:
wordenter3.pngwordenter2.pngWorking for me in the attached QSF if it helps.
WordEnter.qsf

Leave a Reply


Terms & Conditions