Embedded data | XM Community
Skip to main content

I have the following code in which participants will be exposed to different stimuli and I need to record their decisions under an embedded data. However, my code is only recording the last block rather than all of them. My skills on JavaScript are quite basic, so any advice would be appreciate.

 

<!DOCTYPE html>
<html>
<head>
  <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
  <script>
    Qualtrics.SurveyEngine.addOnload(function() {
      // Retrieve the stored token values from embedded data
      var yourTokens = parseInt("${e://Field/yourTokens}") || 400;
      var initialPlayerToken = 400;

      // Find all question containers in the block
      var questionContainers = document.querySelectorAll('divuid^="QID"]');

      // Loop through each question container
      questionContainers.forEach(function(container) {
        var playerTokens;

        Qualtrics.SurveyEngine.addOnReady(function() {
          playerTokens = initialPlayerToken;

          // Create the game elements
          var instructions = document.createElement("div");
          instructions.innerHTML = "Choose your action:";

          var cooperateBtn = document.createElement("button");
          cooperateBtn.innerHTML = "Cooperate";
          cooperateBtn.addEventListener("click", function() {
            handleAction("cooperate", container);
          });

          var defectBtn = document.createElement("button");
          defectBtn.innerHTML = "Defect";
          defectBtn.addEventListener("click", function() {
            handleAction("defect", container);
          });

          var yourAccount = document.createElement("div");
          yourAccount.className = "your-account";
          yourAccount.innerHTML = "Your account: " + yourTokens + " tokens";

          var playerAccount = document.createElement("div");
          playerAccount.className = "player-account";
          playerAccount.innerHTML = "Player account: " + playerTokens + " tokens";

          // Append the game elements to the container
          container.appendChild(instructions);
          container.appendChild(cooperateBtn);
          container.appendChild(defectBtn);
          container.appendChild(yourAccount);
          container.appendChild(playerAccount);

          // Handle the selected action
          function handleAction(action, container) {
            var instructions = container.querySelector("div");
            var cooperateBtn = container.querySelector("button:nth-of-type(1)");
            var defectBtn = container.querySelector("button:nth-of-type(2)");
            var yourAccount = container.querySelector(".your-account");
            var playerAccount = container.querySelector(".player-account");

            // Hide the game elements
            instructions.style.display = "none";
            cooperateBtn.style.display = "none";
            defectBtn.style.display = "none";

            // Show the result
            var result = document.createElement("div");
            var player2Action = "defect";
            var payoff = calculateResult(action, player2Action);
            result.innerHTML = "You chose to " + action + " and the other player chose to " + player2Action + ". Therefore, " + payoff.result;
            container.appendChild(result);

            // Update the token values
            yourTokens += payoff.player1;
            playerTokens += payoff.player2;

            // Update the account values
            yourAccount.innerHTML = "Your account: " + yourTokens + " tokens";
            playerAccount.innerHTML = "Player account: " + playerTokens + " tokens";

            // Update the token values in embedded data
            Qualtrics.SurveyEngine.setEmbeddedData("yourTokens", yourTokens.toString());
            Qualtrics.SurveyEngine.setEmbeddedData("playerTokens", playerTokens.toString());

            // Update the player1Decision in embedded data
            Qualtrics.SurveyEngine.setEmbeddedData("player1Decision", action);
          }

          // Calculate the game result
          function calculateResult(action, player2Action) {
            // Define the payoff matrix
            var payoffMatrix = {
              cooperate: {
                cooperate: { player1: 10, player2: 10 },
                defect: { player1: -10, player2: 20 }
              },
              defect: {
                cooperate: { player1: 20, player2: -10 },
                defect: { player1: 0, player2: 0 }
              }
            };

            // Get the payoff for the chosen actions
            var payoff = payoffMatrix}action]player2Action];

            return {
              result: "you receive " + payoff.player1 + ", and the other player receives " + payoff.player2,
              player1: payoff.player1,
              player2: payoff.player2
            };
          }
        });
      });
    });
  </script>
</head>
<body>
  
</body>
</html>

Two ways I see:

  1. Append the new value to the embedded data so it captures the value from all blocks.
  2. You can define embedded data for each loop to capture the value

Hope this helps.

Two ways I see:

  1. Append the new value to the embedded data so it captures the value from all blocks.
  2. You can define embedded data for each loop to capture the value

Hope this helps.

 

Thanks for your reply.

The first option is actually concatenating all the values in a row. Not easy to see from which block the values came.

No idea how to do the second way you have suggested me.



 

Leave a Reply


Terms & Conditions