How to: Password Box + Answer Validation

Ask the community
,
1

Hey there!

I’ve a very, very basic understanding of coding and wondering how I can achieve the following:

  • A text input box where one or more correct answer is accepted
  • A submit button where it takes you to a NEW PAGE only if the ‘answer’ in the text box is validated

Here’s my use case: I’m making a simple online game where players solve a puzzle and must put the correct answer in a box and if they correctly answer, they can move onto the next page. The answer may need to have multiple validations e.g. “3” or “three”.

Thank you in advance :slight_smile:

2

(Side note: Maybe you should use a MultiStateBox instead of different pages, the performance may be better and the users won’t have to wait for the page transition).

import wixLocation from 'wix-location';
$w.onReady(() => {
$w("#input1").onCustomValidation( (value, reject) => {
  if(value !== "three" && value !== "3") {
    reject("invalid");
  }
} );
$w("#submitButton").onClick(event => {
if($w("#input1").valid) {wixLocation.to("/nextPagePath");}
})
})
3

Ahh I’m afraid my button doesn’t go to the right place - it doesn’t seem to go anywhere! Here’s the page: [https://mairinolan4.wixsite.com/mysite/testing-page](https://mairinolan4.wixsite.com/mysite/testing-page

and)

4

@mairinolan

  1. Since you change the value to uppercase, you have to change it to “THREE” in your code as well.

  2. The url shouldn’t be “/mysite” but the path. let’s say the page you want to redirect to is: https://mairinolan4.wixsite.com/mysite/step-two then in you code you should have wixLocation.to(“/step-two”);

5

Ah -
and change it to:

if(value !== "three" && value !== "3")

And make the input required