How do I connect my HTML code (word count progress bar) to the textarea in Qualtrics? | XM Community
Skip to main content

word count progress bar.pdfI have a code (HTML and Javascript) that gives me a textarea and a progress bar that reacts to the number of words typed into the textarea. I had no struggle including the code before the Qualtrics update.  

Now the problem is:
If the question type I use is a text/graphic, everything looks fine, but the answers participants give are not saved.
If the question type I use is a text entry, the answers participants give in the HTML textarea are not saved and there is another textarea from Qualtrics below my HTML texarea.
 
So I guess I need to connect my code to the existing textarea, but that does not work. How do I do it?

You can finde my code attached. Thank your for your help!

Use a tex/graphic question. Add another text entry question below it.
Add this JS to the Qualtrics text entry question:
Qualtrics.SurveyEngine.addOnReady(function () {
    this.questionContainer.hide();
    let my_text = this.questionContainer.querySelector("textarea");
    document.querySelector("#NextButton").onclick = function () {
        my_text.value = document.querySelector("#progress").next("textarea").value;
    };
});


Thank you for your help!
I tried it and it looks good, but the responses in the text entry field are not safed, I dont see any data for that question when I export the data. I had that problem before when I use the question type text/graphic.
Do you see another option? It seems like the responses are only safed in Qualtrics textareas. Can I make my code react to the existing Texterea in a text entry question?


This is a demo for the code and instructions I shared with you.
Click on the next button to confirm that the text is being captured.


Now I got it! Thank you very much for your help!


Leave a Reply