Validating matrix table to avoid duplication of highest scores

Try this one out…

You'll need to adjust the code to match your specific HTML structure and button IDs. Additionally, make sure to include this JavaScript code within a <script> tag in your web page or Qualtrics survey, either in the survey header or using the Qualtrics JavaScript editor.

// Get all the Likert scale inputs
var likertInputs = document.querySelectorAll('.matrix-table .InputText');

// Add event listeners to the Likert scale inputs
likertInputs.forEach(function(input) {
  input.addEventListener('input', validateScores);
});

// Function to validate the Likert scale scores
function validateScores() {
  var scores = [];
  
  // Get the scores from the Likert scale inputs
  likertInputs.forEach(function(input) {
    var score = parseInt(input.value);
    if (!isNaN(score)) {
      scores.push(score);
    }
  });
  
  // Check for duplicates of the highest score
  var maxScore = Math.max(...scores);
  var countMaxScore = scores.filter(function(score) {
    return score === maxScore;
  }).length;
  
  // Disable or enable the submit button based on the validation result
  var submitButton = document.getElementById('submit-button');
  if (countMaxScore > 1) {
    submitButton.disabled = true;
    alert('Please assign the highest score to only one statement.');
  } else {
    submitButton.disabled = false;
  }
}
 

Hi Shivamvig

Thank you very much for your quick reply.  I tried to put it into the Matrix table. I am not sure what i did wrong. 

Here is the HTML text

<strong>Please assign the highest rating to only one emotion.</strong>

<div>
 <button id="submit" style="font-weight: bold; margin-right: 10px;">submit</button>
 </div>

Here is the code in the Matrix table Java Script

Qualtrics.SurveyEngine.addOnload(function() {
 // Get all the Likert scale inputs
var likertInputs = document.querySelectorAll('.Matrix .InputText');

    
// Add event listeners to the Likert scale inputs
likertInputs.forEach(function(input) {
  input.addEventListener('input', validateScores);
});

// Function to validate the Likert scale scores
function validateScores() {
  var scores = [];
  
  // Get the scores from the Likert scale inputs
  likertInputs.forEach(function(input) {
    var score = parseInt(input.value);
    if (!isNaN(score)) {
      scores.push(score);
    }
  });
  
  // Check for duplicates of the highest score
  var maxScore = Math.max(...scores);
  var countMaxScore = scores.filter(function(score) {
    return score === maxScore;
  }).length;
  
  // Disable or enable the submit button based on the validation result
  var submitButton = document.getElementById('submit');
  if (countMaxScore > 1) {
    submitButton.disabled = true;
    alert('Please assign the highest score to only one statement.');
  } else {
    submitButton.disabled = false;
  }
}
});

In addition, is it possible to place the validation on or before going to the next page?  If errors are detected, allow correction before proceeding to the next page.  here is the screenshot

Many thanks, Marjorie