const valueErrorMessageText = 'ERROR MESSAGE'
const maximumSumAllowed = 1000


let showingValueErrorMessage = false


Qualtrics.SurveyEngine.addOnReady(function() {
  const questionContainer = this.getQuestionContainer()
  const inputs = questionContainer.getElementsByClassName("InputText")
  for (let j = 0; j < inputs.length; j++) {
    inputsnj].addEventListener("input", (e) => {validate(e, inputs)})
  }
})


function validate(e, inputs) {
  var parentElementId = e.currentTarget.id.split("~")i1]
  var parent = document.getElementById(parentElementId)


  let numbers = u...inputs].map(input => parseFloat(input.value) || 0)
  let sum = numbers.reduce((prev, cur, idx) => prev + cur, 0)


  // DEFINE VALIDITY HERE
  let isValid = (sum <= maximumSumAllowed)


  if (isValid) {
    parent.style.border = "0"
    Qualtrics.SurveyEngine.Page.unblockNavigationForFraud()
    setShowValueError(false, parent)
  } else {
    Qualtrics.SurveyEngine.Page.blockNavigationForFraud()
    parent.style.border = "3px #F00 solid"
    setShowValueError(true, parent)
  }


}


function setShowValueError(show, questionParentElement) {
  const elementClass = 'value-error'
  const element = questionParentElement.querySelector('.' + elementClass) || undefined
  if (!show && element) {
    element.style.display = 'none'
  } else if (show && element && element.style.display === 'none') {
    element.style.display = 'block'
  } else if (show && !element) {
    const newElement = document.createElement('div')
    newElement.className = elementClass
    newElement.style.display = 'block'
    newElement.style.color = '#F00'
    newElement.innerText = valueErrorMessageText
    newElement.style.textAlign = 'center'


    questionParentElement.appendChild(newElement)
  }
}

---

https://community.qualtrics.com/XMcommunity/discussion/comment/52386#Comment_52386Thank you very much, srbaumruk ! This is impressive, well-done code!
I have 3 follow-up questions about this code.

• Should I place the code below under addOnload function?

const valueErrorMessageText = 'ERROR MESSAGE'
const maximumSumAllowed = 1000


let showingValueErrorMessage = false

• I keep getting the error message "Invalid JavaScript! You cannot save until you fix all errors: Unexpected token )". Could you please provide some hints about how to debug it?


• Does this code add a new button or replace the built-in "next" button? If it adds a new button, how should I remove the original button?

Thanks again!

---

rzhao3

https://community.qualtrics.com/XMcommunity/discussion/comment/52389#Comment_523891. Should I place the code below under addOnload function?

You should be able to delete everything in the code window, and replace the entirety of it with the code I provided.

2. Invalid JavaScript! You cannot save until you fix all errors: Unexpected token )

I double checked to see if there was an extra parenthesis in the code I provided, but it doesn't seem to be the case. I recommend deleting the entirety of the code in the code window, and copy-pasting again. If you still receive this error, feel free to reply, copy-pasting the same code and we can see if there is some kind of copy paste error going on (copying code from this forum can sometimes be fickle).

3. Does this code add a new button or replace the built-in "next" button? If it adds a new button, how should I remove the original button?

It uses the built-in next button. If there is an invalid sum, it disables it until the sum is valid. No additional configuration should be required to make this work correctly.

---

Thanks again,  srbaumruk.
This code works perfectly.
May I ask some questions about the following steps?

1. If I want the validation to be: The sum of 3 numbers entered must be equal to a number. How should I modify the code? I changed

   let isValid = (sum <= maximumSumAllowed) 

   to

   let isValid = (sum = maximumSumAllowed)

   , but it doesn't work.


2. If I want the message to include a number based on the participants' choice in a previous question. The number is (1 - q://QID1453/ChoiceTextEntryValue / 100 ) * e://Field/Original_Fund. What should I add to the message code? I want to message to be "Your investment amount cannot exceed $number".

I really appreciate your help these days!
Fred

---