Custom error Javascript validation | XM Community
Skip to main content

Hi community, while designing a survey recently encountered with a custom error condition.

In a qualification demographic question there are 8 options, it’s a multiple choice question with other(OE response) at last position.

We have options like 

  1. Student
  2. retired
  3. Employed part time
  4. Employed Full time 
  5. homemaker
  6. UnEmployed (exclusive)
  7. Business owner
  8. others(please specify)

We have a condition that if respondent select student and retired, a custom error message will display that these two options can’t be selected together. 
 

we have multiple conditions to display error messages like:

1 and 2 selected together     

1 and 4 

2 and 4 

2 and 3 and so on.. 


this survey will run in two different languages, English and spainish.

 Can anyone help how can I achieve this in both languages in a single survey?

++ Also the custom error will be displayed according to the survey language. 
like if respondent selected English then error message should be in English and if any other language selected then in that language.

 


@Sameer.65 

Try using custom validation, something like below and the error message can be translated in library as well.
 

Hope it helps!


Hi @Deepak : thanks for your suggestion. 
however, just want to reconfirm that the error message should be like ‘Student’ and ‘Retired’ can not be selected together. And this goes same for all other conditions as well. So should I have to create multiple error message in library and have to add multiple conditions and error message accordingly to these?


 @Sameer.65 

You can add multiple conditions as you mentioned, but the error message can only be one. For example “the two fields cannot be selected together”. Try something generic. If you like a custom message to appear you would require Custom coding.

Hope it helps!


@Deepak : As per client’s requirements, error message should consist options name in it. 
Custom JavaScript code is needed to solve this.


BTW thank you for your help! Appreciate it.


@Deepak : As per client’s requirements, error message should consist options name in it. 
Custom JavaScript code is needed to solve this.


BTW thank you for your help! Appreciate it.

Sure, something like below could work you need to replicate for your choices
 

Qualtrics.SurveyEngine.addOnReady(function()
{
/*Place your JavaScript here to run when the page is fully displayed*/
jQuery('#'+this.questionId).click(function(){
var first= jQuery('input').eq(0).prop('checked');
var sec = jQuery('input').eq(1).prop('checked');

if(first==true && sec==true){

jQuery('.ValidationError').eq(1).show().html("Cannot select together");
jQuery('#NextButton').prop('disabled',true);

}
else{
jQuery('.ValidationError').eq(1).hide();
jQuery('#NextButton').prop('disabled',false);
}

});
});

Here I have included a static error text but you can pull it from embedded data based on language code.
Hope it helps!


@Sameer.65,

You can pipe the selected choices into the validation message inside an element then modify the contents of the element with JS. For example:

<span class="choices">${q://QID1/ChoiceGroup/SelectedChoices}</span> cannot be selected together.

 


The easiest option would be to add the error text in your question text with the help of a span as other have illustrated above and then when you’ll translate the survey just update the span text in that language!

Now to put validation, you could use JS or custom validation method. Both has it’s perks but I’d suggest you to go with JS as it’s more flexible than custom validation option as you won’t have the upper hand to prompt your question twice or thrice as you do with JS!

Let me know if you need any help setting it.


Leave a Reply