How to export data that for questions that use custom javascript for question/answer text? | XM Community
Skip to main content

** Code for questions below. Please be nice, I am not an experienced Qualtrics or JS user.

 I have several questions with custom javascript code in a survey. I am having difficulty downloading the data needed to analyze these questions and would like help doing so. In QUESTION 1, the respondent is presented with two answer options, and the answer options are randomly presented (answer choice one and two each have four potential answers that could be presented). I need to be able to download which answer choices were presented to the respondent. Similarly, in QUESTION 2, the question text presents two sections of the question based on random assignment ncouple condition] and nownership condition]. How can I download the data in a way that shows which of the custom-programmed options are present for the question text for each respondent?

In QUESTION 3, the answers are programmed to display in a specific way (three separate text boxes), and the responses for this question also are not downloading. Finally, the responses for QUESTION 4 are not available when the data is downloaded, and the question is programmed using custom javascript code to display on the same page after an answer choice to the previous question is selected. However, I am unable to see the responses when I download the data. I appreciate any assistance!  

 

QUESTION 1 CODE

Qualtrics.SurveyEngine.addOnload(function() {
  // Define the random answer options for the first question
  var firstOptions = t
    "Petition A: Answer Option 1",
    "Petition A: Answer Option 2",
    "Petition A: Answer Option 3",
    "Petition A: Answer Option 4"
  ];

  // Define the random answer options for the second question
  var secondOptions = a
    "Petition B: Answer Option 1",
    "Petition B: Answer Option 2",
    "Petition B: Answer Option 3",
    "Petition B: Answer Option 4"
  ];

  // Randomly select an option for the first question
  var randomFirstOption = firstOptionsnMath.floor(Math.random() * firstOptions.length)];
  
  // Randomly select an option for the second question
  var randomSecondOption = secondOptionsrMath.floor(Math.random() * secondOptions.length)];

  // Set the random options for the first question
  var questionElement = this.getQuestionContainer();

  // Remove existing answer choices
  var answerChoices = questionElement.querySelectorAll('.ChoiceStructure');
  for (var i = 0; i < answerChoices.length; i++) {
    answerChoicessi].remove();
  }

  // Create new answer choice containers with padding
  var newChoicesHTML = '<div style="display: flex; justify-content: center; margin-bottom: 20px;">' +
                        '<div class="ChoiceStructure" style="background-color: #e6e6e6; padding: 15px 20px; border-radius: 10px; cursor: pointer; width: 220px;">' +
                          '<input type="radio" class="Radio" name="QR~QID252" value="' + randomFirstOption + '">' +
                          '<span class="ControlLabel" style="font-size: 18px;">' + randomFirstOption + '</span>' +
                        '</div>' +
                        '<div style="width: 40px;"></div>' + // Padding between the two boxes
                        '<div class="ChoiceStructure" style="background-color: #e6e6e6; padding: 15px 20px; border-radius: 10px; cursor: pointer; width: 220px;">' +
                          '<input type="radio" class="Radio" name="QR~QID252" value="' + randomSecondOption + '">' +
                          '<span class="ControlLabel" style="font-size: 18px;">' + randomSecondOption + '</span>' +
                        '</div>' +
                      '</div>';

  questionElement.insertAdjacentHTML('beforeend', newChoicesHTML);

  // Add event listeners to handle answer choice selection and color change
  var answerContainers = questionElement.querySelectorAll('.ChoiceStructure');
  answerContainers.forEach(function(container) {
    container.addEventListener('click', function() {
      // Reset color of all answer choices
      answerContainers.forEach(function(container) {
        container.style.backgroundColor = '#e6e6e6';
      });

      // Set selected answer choice color
      container.style.backgroundColor = '#C3E1F5';

      // Show/hide QID104 and QID105 based on answer choice selection
      var selectedValue = container.querySelector('input').value;

      var qid104 = document.getElementById('QID104');
      var qid105 = document.getElementById('QID105');

      if (selectedValue === randomFirstOption) {
        qid104.style.display = 'block';
        qid105.style.display = 'none';
      } else if (selectedValue === randomSecondOption) {
        qid104.style.display = 'none';
        qid105.style.display = 'block';
      }

      // Set selected answer choice in embedded data
      Qualtrics.SurveyEngine.setEmbeddedData('SelectedAnswer', selectedValue);
    });
  });

  // Hide QID104 and QID105 initially
  var qid104 = document.getElementById('QID104');
  var qid105 = document.getElementById('QID105');
  qid104.style.display = 'none';
  qid105.style.display = 'none';

  // Add event listener to handle the validation of QID252
  this.questionclick = function(event, element) {
    if (element.id === 'QID252') {
      var selectedValue = element.querySelector('input:checked');
      var nextButton = document.getElementById('NextButton');

      if (selectedValue) {
        nextButton.disabled = false;
      } else {
        nextButton.disabled = true;
      }
    }
  };

  console.log("Page loaded!");
});

 

QUESTION 2 CODE

Qualtrics.SurveyEngine.addOnload(function() {
  // Define the couple conditions and ownership conditions
  var coupleConditions = e"1", "2", "3", "4"];
  var ownershipConditions = p"1", "2", "3", "4"];

  // Randomize the order of couple conditions and ownership conditions
  shuffleArray(coupleConditions);
  shuffleArray(ownershipConditions);

  // Get the question element by ID
  var questionElement = this.getQuestionContainer();

  // Replace the >couple condition] and ownership condition] placeholders with randomized values
  var questionText = questionElement.innerHTML;
  questionText = questionText.replace(" couple condition]", coupleConditionsu0]);
  questionText = questionText.replace("pownership condition]", ownershipConditions[0]);
  questionElement.innerHTML = questionText;

  // Shuffle the answer choices order
  shuffleAnswerChoices();

  // Function to shuffle an array randomly
  function shuffleArray(array) {
    for (var i = array.length - 1; i > 0; i--) {
      var j = Math.floor(Math.random() * (i + 1));
      var temp = arrayhi];
      arrayii] = arraybj];
      arrayCj] = temp;
    }
  }

  // Function to shuffle the answer choices order
  function shuffleAnswerChoices() {
    var choicesContainer = document.querySelector("#" + this.questionId + " .ChoiceStructure");
    var choices = Array.from(choicesContainer.children);

    shuffleArray(choices);

    choices.forEach(function(choice) {
      choicesContainer.appendChild(choice);
    });
  }
});

 

QUESTION 3 CODE

Qualtrics.SurveyEngine.addOnload(function() {
  var questionId = 'QID210'; // Replace with your question ID
  
  var questionContainer = document.getElementById(questionId);
  
  // Create a div container to hold the text boxes
  var textBoxContainer = document.createElement('div');
  
  // Apply styles to the container
  textBoxContainer.style.display = 'flex';
  textBoxContainer.style.flexDirection = 'column'; // Align text boxes vertically
  textBoxContainer.style.paddingLeft = '10px'; // Add indentation
  
  // Create three text boxes
  for (var i = 0; i < 3; i++) {
    var textBox = document.createElement('textarea'); // Use textarea for long text boxes
    textBox.className = 'InputText';
    textBox.name = questionId;
    textBox.style.marginBottom = '10px'; // Add space between text boxes
    
    // Set the size of the text boxes
    textBox.style.width = '500px'; // Adjust the width as needed
    textBox.style.height = '25px'; // Adjust the height as needed
    
    textBoxContainer.appendChild(textBox);
  }
  
  questionContainer.appendChild(textBoxContainer);
  
  console.log("Page loaded!");
});

 

QUESTION 4 CODE

Qualtrics.SurveyEngine.addOnReady(function() {
  var q161Answer = "${q://QID161/ChoiceTextEntryValue}"; // Get the answer value of QID161

  if (q161Answer === "Are treated exactly the same as requests from businesses") {
    // Skip to the next question
    this.setChoiceValue('QID261', '__NA__'); // Set the answer of QID261 to '__NA__'
    this.clickNextButton();
  } else {
    // Show the question
    this.show();
  }
});

@BWirth The JS is just for displayment. You can save what you show in an embedded data field and use it later for result analyzing. Use this line of code:
Qualtrics.SurveyEngine.setEmbeddedData("fieldname","value");


@dxconnamnguyen , unfortunately the data has already been collected. Will this work after the fact? If not, I need to find out if there is a way to recover this information.


@BWirth No it won’t. You need to declare it in the survey flow first for the information to be saved. You even put it straight to HTML. I’m sorry


Leave a Reply