using javascript to validate text entry responses | XM Community
Skip to main content
MichaelC
Administrator
7 months ago
Solved

using javascript to validate text entry responses

M
Level 2 ●●
Forum|alt.badge.img+2

I tried using the following javascript, to only allow certain responses to a text entry question. However, it is not working. Any suggestions?

 

Thanks a lot in advance.

 

1Qualtrics.SurveyEngine.addOnPageSubmit(function() {
2  // Target the text entry question by its QuestionID
3  var questionId = 'QID1';
4
5  // Specify the pre-specified options
6  var validOptions = ['Option 1', 'Option 2', 'Option 3'];
7
8  // Get the entered value from the text entry question
9  var enteredValue = this.getChoiceValue(questionId);
10
11  // Check if the entered value is not one of the valid options
12  if (!validOptions.includes(enteredValue)) {
13    this.setChoiceError(questionId, 'Please enter a valid option.');
14    this.disableNextButton(); // Disable the next button
15  } else {
16    this.clearChoiceError(questionId);
17    this.enableNextButton(); // Enable the next button
18  }
19});
20

 

Best answer by TomG

Two more options:

  1. Use an empty select and load the options from a JS object using select2.
  2. If you hit a limitation, load them from a server using select2 ajax option.
View original
PraDeepKotian_XM

10 replies

TomG
Level 8 ●●●●●●●●
Forum|alt.badge.img+27
  • TomG
  • Level 8 ●●●●●●●●
  • 6092 replies
  • June 14, 2023

You should use Custom Validation instead of JavaScript.  Without going into details on your JS, you’ve misunderstood how a number of things work.

M
Level 2 ●●
Forum|alt.badge.img+2
  • mapleleaf
  • Author
  • Level 2 ●●
  • 6 replies
  • June 14, 2023

Thanks Tom. However, I have hundreds of text options to put in, instead of 3 in the attempted code. Could you provide some hints to correcting the code?

TomG
Level 8 ●●●●●●●●
Forum|alt.badge.img+27
  • TomG
  • Level 8 ●●●●●●●●
  • 6092 replies
  • June 14, 2023

In that case, I recommend using a multiple choice question with a dropdown instead of a text entry question. You could use select2 to make it searchable.

Another option might be Supplemental Data if you have that feature on your Qualtrics account.

M
Level 2 ●●
Forum|alt.badge.img+2
  • mapleleaf
  • Author
  • Level 2 ●●
  • 6 replies
  • June 14, 2023

Thanks Tom. I will give select2 a try and report back.

M
Level 2 ●●
Forum|alt.badge.img+2
  • mapleleaf
  • Author
  • Level 2 ●●
  • 6 replies
  • June 17, 2023

Dropdown + select2 worked nicely!

M
Level 2 ●●
Forum|alt.badge.img+2
  • mapleleaf
  • Author
  • Level 2 ●●
  • 6 replies
  • June 17, 2023

I concluded too early. I ran into a problem with the 20,000 character limit when I input all the options. Any other idea to solve this?

TomG
Level 8 ●●●●●●●●
Forum|alt.badge.img+27
  • TomG
  • Level 8 ●●●●●●●●
  • 6092 replies
  • June 17, 2023

You can use a text entry question. Add you own select in the question text html. Use JS to hide the text input, add select2, and copy the select value to the text entry on update or submit.

M
Level 2 ●●
Forum|alt.badge.img+2
  • mapleleaf
  • Author
  • Level 2 ●●
  • 6 replies
  • June 17, 2023

The idea is brilliant, but I hit the 20,000 character limit again when I added my select in html.

TomG
Level 8 ●●●●●●●●
Forum|alt.badge.img+27
  • TomG
  • Level 8 ●●●●●●●●
  • 6092 replies
  • Answer
  • June 17, 2023

Two more options:

  1. Use an empty select and load the options from a JS object using select2.
  2. If you hit a limitation, load them from a server using select2 ajax option.
M
Level 2 ●●
Forum|alt.badge.img+2
  • mapleleaf
  • Author
  • Level 2 ●●
  • 6 replies
  • June 17, 2023

Empty select worked. Grateful for your advice, Tom!

P.S. In case it is useful for future visitors to this page -- if there is ‘ in one of the options, need to escape it to make the code work. This took me the longest time to figure out...

Leave a Reply


Terms & ConditionsAccessibility statement