Multiple condition if-statement not working (using OR)

Please assist me with this condition:

 let idMax = $w("#idNumber").maxLength = 13; //all above onReady
 let passMax = $w("#passportNumber").maxLength = 9; 
 let asyMax = $w("#asylumNumber").maxLength = 9; 
 let idLength = 0;        
 let passLength = 0; 
 let asyLength = 0;

//I then created an onChange for each of the above (only one document of the 3 needs to be filled in

//Here is the ID onchange (the other 2 are exactly the same, so leaving them off for simplicity
export function idNumber_change(event) {          
idLength = $w('#idNumber').value.length;     
var remainingLength = idMax - idLength;          

if(remainingLength > 0){                   
$w('#text151').text = `Only ${remainingLength} remaining characters.`;              }
else{         
$w('#text151').collapse();     
}}       

export function submitButton_click(event) {      

if(((idMax - idLength) === 0) || ((passMax - passLength) === 0) || ((asyMax - asyLength) === 0) || ((pinMax - pinLength) === 0)){

//THIS FAILS WHEN A USER TYPES IN 5 OF THE 13 ID NUMBERS AND CLICKS SUBMIT. IT STILL SUBMITS WHEN IT SHOULD HAVE 13 OF 13 CHARACTERS 
   
}
}

My issue is that on Submit, when my conditions are not met, it still goes into the statement as though it succeeded.
Eg. If an ID Number is 13 characters, and the user types in 5, then clicks submit, it assumes it has 13?

HOWEVER, when I only use
if ((idMax - idLength) ===0 )

This works fine. Why are the multiple conditions not working with || ?

Why aren’t you set the min and max characters directly to the input elements?
https://www.wix.com/velo/reference/$w/textinput/min
https://www.wix.com/velo/reference/$w/textinput/max

$w("#myTextInput").max = 13;
$w("#myTextInput").min = 1;

Because I need it to be 13 Characters long, not number 13. I’m validating number of digits/characters in the input, not its numerical value.

@kscholiadis so use onCustomValidation:

$w("#input").onCustomValidation((value, reject) => {
  if(value.length < 1 || value.length > 13) {
    reject("invalid num of chars");
  }
});
1 Like

@jonatandor35 How do I do several validations with one final ELSE that accepts the information?
Could you help me with my example above:
if ((( idMax - idLength ) === 0 ) || (( passMax - passLength ) === 0 ) || (( asyMax - asyLength ) === 0 ) || (( pinMax - pinLength ) === 0 )

I’ve tried to read up, but struggling to see how to make this flow.
Thank you.

@kscholiadis

const getCommonRules = () => value.length < 1 || value.length >13 // add other common rules if needed;
$w('#input1').onCustomValidation((value, reject) =>{
if(getCommonRules() /* && a spcific rule*/){
reject("invalid num of chars");//or another message
}
}
$w('#input2').onCustomValidation((value, reject)=>{
if(getCommonRules()){
reject("invalid num of chars");
}
}
//etc.. set the onCustomValidation for each input element

@jonatandor35 Thanks for the example. And how does this work with “Submit” button that Sets Field Values? Will I set the inputs and it will automatically only accept the “accepted” inputs?

Sorry if this is basic. Never used this practically before. Not sure what the output is that is applicable to “Submit”.

@kscholiadis as a matter of fact, I almost never submit forms via a dataset (only with a direct inserts), so I can only tell you, what I 'd expect it to do, and you’ll have to try it.
I think that when you click “Submit”, it validates the entire form, and if any of the required fields is not valid, it won’t let you submit the form at all and will make the invalid input element borders red.

(P.S, if you have set some of your inputs to be ‘not required’, it won’t validates them.)