2017-08-08 3 views
0

Wie führe ich diese IF-Anweisungen alle zur gleichen Zeit? Ich möchte alle IFs vor RETURN überprüfen und alle Nachrichten in document.getElementById ('td100'). InnerHTML anzeigen.Javascript - Alle IFs zur gleichen Zeit validieren

Zum Beispiel: Wenn ich mit meinem Formular ausfüllen:

  1. eine ungültige E-Mail (dh ohne @ -Zeichen)
  2. meine E-Mails stimmen nicht überein
  3. meine Passwörter stimmen nicht überein
  4. und mein Passwort erfüllt nicht die Längenanforderung

Wie zeige ich ALLE Fehler in (td100)?

function regValidation() 
{ 
    document.getElementById('td100').innerHTML = ""; 
    event.preventDefault ? event.preventDefault() : event.returnValue = false; 

    var email1 = document.getElementById('em100').value; 
    var email2 = document.getElementById('em101').value; 
    var pass1 = document.getElementById('pw100').value; 
    var pass2 = document.getElementById('pw101').value; 

    if (!document.getElementById('em100').checkValidity()) return document.getElementById('td100').innerHTML += "</br>Emails are not valid."; 
    if (email1 !== email2) return document.getElementById('td100').innerHTML += "</br>Emails do not match."; 
    if (pass1 !== pass2) return document.getElementById('td100').innerHTML += "</br>Passwords do not match."; 
    if (pass1.length < @minPass || pass1.length > @maxPass) return document.getElementById('td100').innerHTML += "</br>Password must be @minPass - @maxPass characters."; 

    return true && regSuccess(); 
} 
+3

Erstellen Sie eine Folge von Fehlermeldungen und stellen Sie dann das HTML einmal ein, so: 'var errors =" "; if (Bedingung) {Fehler + = "Fehlermeldung";} if (...), ..., document.getElementById ("td100"). innerHTML = Fehler; ' – mhodges

+2

Nicht innerhalb der if-Anweisungen zurückkehren . – user1777136

Antwort

0
function regValidation() 
{ 
    document.getElementById('td100').innerHTML = ""; 
    event.preventDefault ? event.preventDefault() : event.returnValue = false; 

    var error = ""; 
    var email1 = document.getElementById('em100').value; 
    var email2 = document.getElementById('em101').value; 
    var pass1 = document.getElementById('pw100').value; 
    var pass2 = document.getElementById('pw101').value; 

    if (!document.getElementById('em100').checkValidity()) error += "</br>Emails are not valid."; 
    if (email1 !== email2) error += "</br>Emails do not match."; 
    if (pass1 !== pass2) error += "</br>Passwords do not match."; 
    if (pass1.length < @minPass || pass1.length > @maxPass) error += "</br>Password must be @minPass - @maxPass characters."; 

    if (error !== "") 
    { 
     document.getElementById('td100').innerHTML = error 
    } else { 
    return true && regSuccess(); 
    } 
} 
0

Ok, jetzt die wirklich trocken Lösung. Richten Sie eine Tabelle ein und durchlaufen Sie sie:

var checks = [ 
[pass1===pass2,"password missmatch"], 
[email1===email2,"email missmatch"] 
//.. 
]; 

var passed = true; 
var errors=[]; 
for(let [check,message] of checks){ 
    if(!check){ 
    alert(message)//show message 
    //or collect: 
    errors.push(message); 

    passed = false; 
    } 
} 

//now passed contains the result: 
if(passed) 
    alert("wohoo, all fine ;)"); 

//and errors can be shown: 
document.getElementById("err") 
    .innerHTML=errors.join("<br>"); 
Verwandte Themen