Multiple Validations on an .onClick event

Ask the community
,
1

Hey there!

I have a page with 4 input boxes and 1 submit button. (https://mairinolan4.wixsite.com/mysite/submit-your-report)

I would love for my submit button to check the validation on all 4 boxes before directing to the next page. Here is my coding to help explain:

import wixLocation from 'wix-location';
$w.onReady(() => {
$w("#input1").onCustomValidation( (value, reject) => {
if(value !== "9:20PM" && value !== "9:20pm"){
    reject("invalid");
  }
} );
$w("#submitButton").onClick(event => {
if($w("#input1").valid) {wixLocation.to("/ending");}
})

$w("#input2").onCustomValidation( (value, reject) => {
if(value !== "hubert" && value !== "HUBERT" && value !== "Hubert" && value !== "hubert bagley" && value !== "HUBERT BAGLEY" && value !== "Hubert Bagley"){
    reject("invalid");
  }
} );
$w("#submitButton").onClick(event => {
if($w("#input2").valid) {wixLocation.to("/ending");}
})

$w("#input3").onCustomValidation( (value, reject) => {
if(value !== "ice" && value !== "ICE" && value !== "Ice" && value !== "poisoned ice" && value !== "POISONED ICE" && value !== "Poisoned Ice"){
    reject("invalid");
  }
} );
$w("#submitButton").onClick(event => {
if($w("#input3").valid) {wixLocation.to("/ending");}
})

$w("#input4").onCustomValidation( (value, reject) => {
if(value !== "financial" && value !== "FINANCIAL" && value !== "Financial"){
    reject("invalid");
  }
} );
$w("#submitButton").onClick(event => {
if($w("#input4").valid) {wixLocation.to("/ending");}
})
})

In short: Each box has a correct answer, all answers must be answered correctly before the “Submit” button works. I’m sure there must be a simpler (correct) way of doing this, but I couldn’t find any tutorial on it online.

Something like?

if($w("#input4" && "input3" && "input2" && "input1").valid) {wixLocation.to("/ending");}

Huge thank you in advance for your help! :slight_smile: