Replies: 1 comment
-
|
Hi Claudia, Unfortunately we don't yet have custom validation functions implemented, but it's in the works. But you can use the I'm going to provide an example that's a simplification of your trials, but I hope illustrates how you could do this: var trial = {
type: 'survey-html-form',
html: `<ul>
<li>Option 1: <input value="0" type="number" name="q1" id="u1" min="0" max="100" maxlength=3 required></input></li>
<li>Option 2: <input value="0" type="number" name="q2" id="u2" min="0" max="100" maxlength=3 required></input></li>
<li>Option 3: <input value="0" type="number" name="q3" id="u3" min="0" max="100" maxlength=3 required></input></li>
</ul>
<p id="status">All three options must add up to 100.</p>
`,
on_load: function(){
document.querySelector('input[type="submit"]').disabled = true;
var inputs = document.querySelectorAll('input[type="number"]');
for(var i=0; i<inputs.length; i++){
inputs[i].addEventListener('change', function(){
if(checkSum()){
document.querySelector('input[type="submit"]').disabled = false;
document.querySelector('#status').style.visibility = 'hidden';
} else {
document.querySelector('input[type="submit"]').disabled = true;
document.querySelector('#status').style.visibility = 'visible';
}
})
}
function checkSum(){
var sum = (
parseInt(document.querySelector('#u1').value) +
parseInt(document.querySelector('#u2').value) +
parseInt(document.querySelector('#u3').value)
)
console.log(sum);
return sum == 100
}
}
}You can try it out here: https://xdum7vjqza.cognition.run/ |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
Hello,
As part of a questionnaire, we ask participants to provide three different percentages for every item in a list of 14 questions. The questions are something like: what language(s) do you speak at home? Then they indicate a percentage for Chinese, English and 'other language(s)', which must add up to 100%. The idea is that (perc-chi-use1+perc-eng-use1+perc-other-use1)=100% (perc-chi-use2+perc-eng-use2+perc-other-use2)=100%, etc etc. If more or less than 100%, we don't want them to move on to the next page (similar to 'required'). I tried coding in different ways using conditionals, but they don't seem to be working.
Many thanks in advance,
Claudia
Beta Was this translation helpful? Give feedback.
All reactions