Our survey includes a few multirow/multicolumn matrix tables with constant sum. We've been able to write some custom javascript so that they are only allowed to continue if the totals in all displayed columns are 100% or above. (note: <100 should not be possible and is prevented with an error message etc).
We had to write the custom code due to our particular survey having to account for a total of 100 or above and not just 100%. It's about usage of products and some are used in combination hence >100%
the script works flawlessly if the respondent clicks on the "next" button on the bottom of the page, however, I have just noticed that it completely skips the custom script validation and jumps to the next question if I simply press Enter. The respondent could have answered the question correctly or columns may not add up to 100% or more. - Which is obvisouly not my intention.
My question now, is there possibly some code or workaround that prevents a respondent to use enter to skip to the next page/question? At least for the questions where we have this particular script running?
Thanks!
Any help or pointers would be much appreciated.
Post your code.
Qualtrics.SurveyEngine.addOnload(function() {
jQuery("#"+this.questionId+" td inpututype=text]").val("");
});
Qualtrics.SurveyEngine.addOnReady(function()
{
//_____________________hide and display next button---------------------------------------------------
var warnings = ];
/*-----Hide button function -----*/
function hideEl(element) {
if($(element)) $(element).hide();
}
//-----Create button function-----
function createNextButton() {
var nextButtonHTML = '';
jQuery('#Buttons').append(nextButtonHTML);
}
hideEl.defer('NextButton');
//----Call create button function-----
createNextButton();
//------------------------------------TRIGGER NEXTBUTTON ON ENTER KEY---------------------------------------------------------
var input = document.getElementById("CustomNextButton");
input.addEventListener("keydown", function(event) {
if (event.keyCode === 13) {
var COL1Total = 0;
if (document.body.contains(document.getElementById('QID64~4_Total'))) {
COL1Total = Number(document.getElementById('QID64~4_Total').value);
} else {
COL1Total = 100;
}
var COL2Total = 0;
if (document.body.contains(document.getElementById('QID64~5_Total'))) {
COL2Total = Number(document.getElementById('QID64~5_Total').value);
} else {
COL2Total = 100;
}
var COL3Total = 0;
if (document.body.contains(document.getElementById('QID64~6_Total'))) {
COL3Total = Number(document.getElementById('QID64~6_Total').value);
} else {
COL3Total = 100;
}
var COL4Total = 0;
if (document.body.contains(document.getElementById('QID64~7_Total'))) {
COL4Total = Number(document.getElementById('QID64~7_Total').value);
} else {
/*-------------------------------------------Action if condition is accepted----------------------------------------------*/
if (COL1Total >= 100 && COL2Total >= 100 && COL3Total >= 100 && COL4Total >= 100){
jQuery('#NextButton').click();
jQuery('#CustomNextButton').hide();
}
event.stopImmediatePropagation();
document.getElementById("CustomNextButton").click();
} else {
/* error message */
var errorMsg = "Please total each column to 100 or more";
var x = document.createElement("DIV");
var t = document.createTextNode(errorMsg);
x.className = "ValidationError";
x.appendChild(t);
document.getElementById('Questions').parentElement.appendChild(x);
jQuery(".ValidationError").html("Please total each column to 100 or more");
}
})
//------------------------------------------TRIGGER NEXT BUTTON ON CLICK------------------------------------------------
jQuery('#CustomNextButton').on('click', function() {
/*----------------------------IF and Document Contains Elements statements---------------------
This is to address the fact that some columns may not be displayed depending on the respondent’s selections in the Q7*/
var COL1Total = 0;
if (document.body.contains(document.getElementById('QID64~4_Total'))) {
COL1Total = Number(document.getElementById('QID64~4_Total').value);
} else {
COL1Total = 100;
}
var COL2Total = 0;
if (document.body.contains(document.getElementById('QID64~5_Total'))) {
COL2Total = Number(document.getElementById('QID64~5_Total').value);
} else {
COL2Total = 100;
}
var COL3Total = 0;
if (document.body.contains(document.getElementById('QID64~6_Total'))) {
COL3Total = Number(document.getElementById('QID64~6_Total').value);
} else {
COL3Total = 100;
}
var COL4Total = 0;
if (document.body.contains(document.getElementById('QID64~7_Total'))) {
COL4Total = Number(document.getElementById('QID64~7_Total').value);
} else {
COL4Total = 100;
}
/*-------------------------------------------Action if condition is accepted----------------------------------------------*/
if (COL1Total >= 100 && COL2Total >= 100 && COL3Total >= 100 && COL4Total >= 100){
jQuery('#NextButton').click();
jQuery('#CustomNextButton').hide();
}
/*-------------If conditions are not met then...----------------------*/
else {
/* error message */
var errorMsg = "Please total each column to 100 or more";
var x = document.createElement("DIV");
var t = document.createTextNode(errorMsg);
x.className = "ValidationError";
x.appendChild(t);
document.getElementById('Questions').parentElement.appendChild(x);
jQuery(".ValidationError").html("Please total each column to 100 or more");
}
});
});
Qualtrics.SurveyEngine.addOnUnload(function()
{
/*Place your JavaScript here to run when the page is unloaded*/
});
Slight overkill, apologies.
Since you have a keydown event handler on the CustomNextButton, check your console for possible errors in that handler function. If no errors, use console.log() to add debugging info to figure out what is going wrong.
BTW, you can do this without JS using Custom Validation and math operations. See this comment to get the general idea: https://www.qualtrics.com/community/discussion/comment/13115#Comment_13115
Thanks, will look into it in regard to JS.
You, though Sir are a star! It took me a day to understand what you menat with the custom validation since I figured this wouldn't work with display logic for columns.
My dilemma was the following:
Only showing columns in Q2 that were above 0 in Q1, see below:
Q1:
Q2:
d
The issue I ran into was what if Column 2 is not shown in Q2 then the custom validation would still expect columns 2 to be 100 or above. Dum dum me. I thought a bit longer about your post and came up with the following:
Each column needs to be a separate logic set as follows:
Row1 Column 1 with me would have been:
Greater than or equal to this
$e{ 100 - q://QID4/ChoiceNumericEntryValue/4/1 - q://QID4/ChoiceNumericEntryValue/5/1 - q://QID4/ChoiceNumericEntryValue/7/1 - q://QID4/ChoiceNumericEntryValue/9/1 - q://QID4/ChoiceNumericEntryValue/10/1 - q://QID4/ChoiceNumericEntryValue/12/1 - q://QID4/ChoiceNumericEntryValue/13/1 - q://QID4/ChoiceNumericEntryValue/14/1 - q://QID4/ChoiceNumericEntryValue/17/1 - q://QID4/ChoiceNumericEntryValue/18/1 - q://QID4/ChoiceNumericEntryValue/19/1 - q://QID4/ChoiceNumericEntryValue/20/1 - q://QID4/ChoiceNumericEntryValue/21/1 - q://QID4/ChoiceNumericEntryValue/22/1 - q://QID4/ChoiceNumericEntryValue/23/1 }
or not displayed
THEN another logic set with the exact above referencing the entries for row 1 Column2
etc
Thank you TomG!!!
While it takes me a while to think around seven corners in this way - this is a much better solution excluding javascript.
Kilito - Nice! Congrats.
I seem to have run into a few hiccups unfortunately. I'd be really grateful for any pointer if at all possible.
Our custom validation look a little like this for each row 1 field in an 11column matrix constant sum question
$e{ 100 - q://QID64/ChoiceNumericEntryValue/4/4 - q://QID64/ChoiceNumericEntryValue/5/4 - q://QID64/ChoiceNumericEntryValue/7/4 - q://QID64/ChoiceNumericEntryValue/9/4 - q://QID64/ChoiceNumericEntryValue/10/4 - q://QID64/ChoiceNumericEntryValue/12/4 - q://QID64/ChoiceNumericEntryValue/13/4 - q://QID64/ChoiceNumericEntryValue/14/4 - q://QID64/ChoiceNumericEntryValue/17/4 - q://QID64/ChoiceNumericEntryValue/18/4 - q://QID64/ChoiceNumericEntryValue/19/4 - q://QID64/ChoiceNumericEntryValue/20/4 - q://QID64/ChoiceNumericEntryValue/21/4 - q://QID64/ChoiceNumericEntryValue/22/4 - q://QID64/ChoiceNumericEntryValue/23/4 }
Or if that field is not displayed, so looks like this:
Now the problem that keeps arising is really random or so it seems, this example below does not work:
While this one works:
the validation for row1col1 is the same I believe:
Screenshot 1: 0 is greater than or equal to {100-100}
Screenshot 2: 0 is greater than or equal to {100-100}
What am I doing wrong?
screenshots didn't post. :(
I've gone through each validation code and the piped text dozens of times and I can't find the mistake if there is one. (but there must be one)
I've got a test link: https://singuserdofjdigu.eu.qualtrics.com/jfe/preview/SV_3ORM1iTnFQOgabP?Q_SurveyVersionID=current&Q_CHL=preview
There is a problem with Column 1/R15. Check the condition and the math operation.
Thank the heavens for you, for some reason (maybe bad copy/pasting on my part in excel with all the piped in data fields).
The (I presume) mistake was this. For some reason there is a tiny tiny space between V and the a in 
but only distinguishable by clicking on that particular cell. Annoying. Thanks once more! It wasn't an actual space more like an informal space filler...
Leave a Reply
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.