How to save a JavaScript variable value into a database? | XM Community
Skip to main content

Question: How to save a JavaScript variable value into a database?

Problem: I made a mini JavaScript game where the clicks buttons and the game records the user’s responses in a JavaScript list of string-type responses. This works fine. My issue is now being able to store that list as a response into a database that can be used later to analyze. 

I am going to provide the entire code below. But imo, the important part is somehow storing the var viewList into a dataset? I would assume, there is a POST type of method I can implement in my custom function endGame(), which will store it in a dataset.

Code:

Qualtrics.SurveyEngine.addOnload(function()

{

    let randomList = d"jelly", "mints", "starburts"];

        let orderedList = o"Apple", "Banana", "Coconut"];

        let randomListCopy = ...randomList];

        let orderedListCopy = l...orderedList];

        let viewedList = ];

        let value = "";

        let gameOn = true;

        let round = 1;

        let p = .5 //Math.random();

        let q = 1 - p;

        function getRandomInt(max) {

            return Math.floor(Math.random() * max);

        }

        function renderPreGame() {

            document.getElementById('qChoiceClass').style.visibility = 'hidden';

            document.getElementById('pChoiceClass').style.visibility = 'hidden';

            document.getElementById('roundID').style.visibility = 'hidden';

            document.getElementById('pqResult').style.visibility = 'hidden';

            document.getElementById('endGame').style.visibility = 'hidden';

        }

        function startGame() {

            document.getElementById('startGame').style.visibility = 'hidden';

            document.getElementById('qChoiceClass').style.visibility = 'visible';

            document.getElementById('pChoiceClass').style.visibility = 'visible';

            document.getElementById('roundID').style.visibility = 'visible';

            document.getElementById('pqResult').style.visibility = 'visible';

            document.getElementById('roundID').innerHTML = "Round: " + round;

            document.getElementById('pqResult').innerHTML = "Choice: ";

            choosingPQ();

        }

        function endGame() {

            document.getElementById('qChoiceClass').style.visibility = 'hidden';

            document.getElementById('pChoiceClass').style.visibility = 'hidden';

            document.getElementById('roundID').style.visibility = 'visible';

            document.getElementById('pqResult').style.visibility = 'visible';

            document.getElementById('endGame').style.visibility = 'visible';

            document.getElementById('pqResult').innterHTML = "Choice: " + value;

            console.log(viewedList);

        }

        function choosingPQ () {

            

            if (Math.random() < p) {

                if (randomList.length === 0) {

                    randomList = n...randomListCopy];

                }

                index = getRandomInt(randomList.length);

                value = randomListnindex];

                console.log(value);

                randomList.splice(index, 1);

                document.getElementById("pBtnSkip").disabled = false;

                document.getElementById("qBtnChoose").disabled = true;

                document.getElementById("qBtnLook").disabled = true;

                document.getElementById("pqResult").style.background = "rgb(255, 55, 55)";

                document.getElementById("pqResult").innerHTML = "Choice: " + value;

                viewedList.push(value);

                

            } else {

                

                if (orderedList.length === 0) { 

                    orderedList = o...orderedListCopy];

                }

                value = orderedList.shift();

                console.log(value);

                console.log(orderedList.length);   

                

                document.getElementById("pBtnSkip").disabled = true;

                document.getElementById("qBtnChoose").disabled = false;

                document.getElementById("qBtnLook").disabled = false;

                document.getElementById("pqResult").style.background = "rgb(86, 193, 86)";

                document.getElementById("pqResult").innerHTML = "Choice: " + value;

                viewedList.push(value);

            }   

        }

        

        document.getElementById("startGame").addEventListener("click", function() {

            startGame();

        });    

        document.getElementById("pBtnSkip").addEventListener("click", function() {

            round++;

            document.getElementById("roundID").innerHTML = "Round: " + round;

            choosingPQ();

        });

        document.getElementById("qBtnChoose").addEventListener("click", function() {

            document.getElementById("roundID").innerHTML = "Round: " + round;

            console.log("game has ended");

            gameOn = false;

            endGame();

        });

        document.getElementById("qBtnLook").addEventListener("click", function() {

            round++;

            document.getElementById("roundID").innerHTML = "Round: " + round;

            choosingPQ();

        });

        

        renderPreGame();


});

Qualtrics.SurveyEngine.addOnReady(function()

{

    jQuery("#"+this.questionId+" .InputText").on('keyup',function(){

        Qualtrics.SurveyEngine.setEmbeddedData( 'viewList', viewList);

    });

});

Qualtrics.SurveyEngine.addOnUnload(function()

{

    /*Place your JavaScript here to run when the page is unloaded*/

});

 

If you need any extra info, please let me know and any help would greatly be appreciated, thank you!

You can save those values in embedded with setEmbeddedData feature in onPageSubmit function.

Data can be stored in embedded data with setEmbeddedData method. But, if you wish to store this in a dataset, check out the below link for adding/updating a record in dataset.

api.qualtrics.com/ff082082294c7-update-a-record-in-an-imported-data-project

Question: How to save a JavaScript variable value into a database?

Problem: I made a mini JavaScript game where the clicks buttons and the game records the user’s responses in a JavaScript list of string-type responses. This works fine. My issue is now being able to store that list as a response into a database that can be used later to analyze. 

I am going to provide the entire code below. But imo, the important part is somehow storing the var viewList into a dataset? I would assume, there is a POST type of method I can implement in my custom function endGame(), which will store it in a dataset.

API won’t work in this Javascript, there’s a seperate section for it. Your code already have the setEmbeddedData function, you just need to state the EmbeddedData it in the surveyflow at the beginning to be able to store it in survey response.
Is the array viewList or viewedList, also try to set-up the code in 1 function, i believe the variable don’t work globally

….

API won’t work in this Javascript, there’s a seperate section for it. Your code already have the setEmbeddedData function, you just need to state the EmbeddedData it in the surveyflow at the beginning to be able to store it in survey response.
Is the array viewList or viewedList, also try to set-up the code in 1 function, i believe the variable don’t work globally

 

Thank you for this response as I was able to get further a little more! You are right, I meant viewedList.

If you are able to confirm/correct what I say next, it would greatly be appreciated!

 

If I want to store a JS variable (be it a string, integer, list) as a response for a Qualtrics dataset, I would first go into the survey flow, press “add a new element here”, click “Embedded data”, name this Qualtrics embedded data (e.g. testVar. Also this would be the column name for the responses?), and apply changes. 

Then go to the javascript portion of the actual survey (specifically within the addOnLoad function), where I want to save the var userResponse. So,  I add the following:

Qualtrics.SurveyEngine.setEmbeddedData(testVar, userResponse);
//does testVar need to be in quotes?

Then I go back to the survey flow, edit the embedded data value to testVar. Is this when I should be able to access the responses?

If I want to store a JS variable (be it a string, integer, list) as a response for a Qualtrics dataset, I would first go into the survey flow, press “add a new element here”, click “Embedded data”, name this Qualtrics embedded data (e.g. testVar. Also this would be the column name for the responses?), and apply changes. 

Then go to the javascript portion of the actual survey (specifically within the addOnLoad function), where I want to save the var userResponse. So,  I add the following:

Qualtrics.SurveyEngine.setEmbeddedData(testVar, userResponse);
//does testVar need to be in quotes?

Then I go back to the survey flow, edit the embedded data value to testVar. Is this when I should be able to access the responses?

  • Yes, you need to add an embedded data named “testVar”, just like declare a variable in coding, at the beginning of the flow.
  • testVar need to be in quote.
  • You don’t need to edit the value, your JS will do it.

Let me know if you have anymore questions

 

Leave a Reply


Terms & Conditions