I have questions throughout my surveys that require validation of numeric entries. In many questions I can use the validation options built into Qualtrics, but several have more advanced validation: I either need to compare the value of one question against the sum of two or more other questions (or the total of column sums of another question) elsewhere in the survey, or compare a date entered to ensure it is within a valid range (before or after another date entry, or a static date). I was able to use JavaScript for all of this in the previous online survey software I used with IF/ELSE conditional statements and alerts or HTML5 messages so that the survey stops progress and displays an error message if an invalid entry is made.
Presumably I can do something similar in Qualtrics with Question JavaScript, but I'm having trouble getting started. I set up a simple JavaScript validation for a question (though I know it could be done instead using built-in options) to make sure I've got the basics right; see below. It catches the error when the entry is less than 3 and displays an alert, but the survey still progresses to the next page after the respondent accepts the alert.
My JavaScript knowledge and experience is limited to the context of the online survey software I used prior to Qualtrics, and I can't tell what I'm overlooking even after searching the community and the wider internet. Any suggestions?
Qualtrics.SurveyEngine.addOnPageSubmit(function()
{
var q1 = parseInt(document.getElementById('QR~QID3').value, 10),
msg = 'Please enter a number greater than 2.';
if (q1 < 3)
{
alert(msg);
document.getElementById('QR~QID3').focus();
return false;
} else {
return true;
}
});
Page 1 / 1
@MatthewM,
I think by the time you get to the addOnPageSubmit function, it is too late to stop the submit. A couple of alternatives:
1. Use JS to add a fake Next button and hide the real Next button. A function attached to the fake next button can check the inputs and click the real next button if they are valid. Otherwise, it displays an error message.
2. Validate the input fields on blur. If a field is invalid, erase the value and display an error message. If you turn on force response, they respondent can't move forward until they provide a valid answer.
My preference is to update the ValidationError text instead of using alerts.
I think by the time you get to the addOnPageSubmit function, it is too late to stop the submit. A couple of alternatives:
1. Use JS to add a fake Next button and hide the real Next button. A function attached to the fake next button can check the inputs and click the real next button if they are valid. Otherwise, it displays an error message.
2. Validate the input fields on blur. If a field is invalid, erase the value and display an error message. If you turn on force response, they respondent can't move forward until they provide a valid answer.
My preference is to update the ValidationError text instead of using alerts.
Thank you @TomG ! In option #2, would you still be able to display the original numeric entry to the respondent as a reference in the error message even though it's being erased in the field?
I'm not really a fan of window alerts either. Is there somewhere I can learn more about changing ValidationError text in Qualtrics?
I'm not really a fan of window alerts either. Is there somewhere I can learn more about changing ValidationError text in Qualtrics?
> @MatthewM said:
> Thank you @TomG ! In option #2, would you still be able to display the original numeric entry to the respondent as a reference in the error message even though it's being erased in the field?
>
> I'm not really a fan of window alerts either. Is there somewhere I can learn more about changing ValidationError text in Qualtrics?
Yes, you could insert the invalid entry into the validation error text. To update the validation error, just find the element with the class ValidationError for the question or entry and change its innerHTML.
> Thank you @TomG ! In option #2, would you still be able to display the original numeric entry to the respondent as a reference in the error message even though it's being erased in the field?
>
> I'm not really a fan of window alerts either. Is there somewhere I can learn more about changing ValidationError text in Qualtrics?
Yes, you could insert the invalid entry into the validation error text. To update the validation error, just find the element with the class ValidationError for the question or entry and change its innerHTML.
@TomG Can you share a simple example of the blur validation? I'm just a novice with JS and I'm spinning my wheels trying to figure this out.
Let's say I have a single text entry question where the input must be 5 characters in length. In my addOnload function I would have something like:
```
var q = jQuery("#"+this.questionId);
var ve = q.find(".ValidationError");
q.find(".InputText").on("blur", function(e) {
if(this.value.length != 5) {
ve.html(this.value + " is not 5 characters in length");
ve.show();
this.value = "";
}
});
```
```
var q = jQuery("#"+this.questionId);
var ve = q.find(".ValidationError");
q.find(".InputText").on("blur", function(e) {
if(this.value.length != 5) {
ve.html(this.value + " is not 5 characters in length");
ve.show();
this.value = "";
}
});
```
Thank you for sharing. I will try to implement this. I wish there was a more straightforward way to validate in Qualtrics, but I appreciate your help.
Leave a Reply
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.