risposta-alla-domanda-sullo-sviluppo-web-bd.com

Convalida del modulo Javascript con conferma della password

Sto cercando di scrivere una pagina di registrazione e sto vivendo il momento più difficile.

<form  action="insert.php" method="post">
    <h1>Registration:</h1>
    <input type="text" name="first" placeholder="First name">
    <input type="text" name="last" placeholder="Last name"><br />
    <input type="text" name="username" placeholder="Username"> <br />
    <input type="password" name="password" placeholder="password"> <br />
    <input type="password" name="confirmPass" placeholder="Confirm Password"> <br />
    <input type="submit" value="Register">
</form>

Questo è il mio codice nella pagina di registrazione. Come chiamo la mia funzione JavaScript e la faccio ancora pubblicare e fare l'azione? L'ho realizzato come un semplice modulo separato ma vorrei unirli

<input id="pass1" type="password" placeholder="Password" style="border-radius:7px; border:2px solid #dadada;" /> <br />
<input id="pass2" type="password" placeholder="Confirm Password" style="border-radius:7px; border:2px solid #dadada;"/> <br />

<script>
    function myFunction() {
        var pass1 = document.getElementById("pass1").value;
        var pass2 = document.getElementById("pass2").value;
        if (pass1 != pass2) {
            //alert("Passwords Do not match");
            document.getElementById("pass1").style.borderColor = "#E34234";
            document.getElementById("pass2").style.borderColor = "#E34234";
        }
        else {
            alert("Passwords Match!!!");
        }
    }
</script>

<button type="button" onclick="myFunction()">Sumbit</button>

Non ho bisogno di aiuto per unirli, so che dovrei cambiare alcune cose, ma se sono insieme, come posso chiamare la funzione JavaScript?

Questo sarà fatto in modo più accurato dopo che avrò capito cosa fare, quindi quale sarebbe il modo migliore per chiamare la mia funzione JavaScript e se ha successo procedi con la pubblicazione e l'azione parte del modulo. Potrei abbandonare il pulsante di invio e fare semplicemente un tipo di pulsante che chiama la funzione JavaScript ma cosa succede se funziona o no? In sostanza (a questo punto) voglio assicurarmi che le password siano le stesse e, in caso contrario, non andare avanti a insert.php ma se corrispondono, passa i dati del modulo a insert.php

javascripthtmlformslogin
10
ajk4550

Aggiungi onsubmit gestore eventi per il tuo modulo:

<form  action="insert.php" onsubmit="return myFunction()" method="post">

Rimuovi onclick da button e rendilo input con il tipo submit

<input type="submit" value="Submit">

E aggiungi dichiarazioni di ritorno booleane alla tua funzione:

function myFunction() {
    var pass1 = document.getElementById("pass1").value;
    var pass2 = document.getElementById("pass2").value;
    var ok = true;
    if (pass1 != pass2) {
        //alert("Passwords Do not match");
        document.getElementById("pass1").style.borderColor = "#E34234";
        document.getElementById("pass2").style.borderColor = "#E34234";
        ok = false;
    }
    else {
        alert("Passwords Match!!!");
    }
    return ok;
}
27
antyrat
 if ($("#Password").val() != $("#ConfirmPassword").val()) {
          alert("Passwords do not match.");
      }

Un approccio JQuery che eliminerà il codice inutile.

3
cyclical

aggiungi questo al tuo modulo:

<form  id="regform" action="insert.php" method="post">

aggiungi questo alla tua funzione:

<script>
    function myFunction() {
        var pass1 = document.getElementById("pass1").value;
        var pass2 = document.getElementById("pass2").value;
        if (pass1 != pass2) {
            //alert("Passwords Do not match");
            document.getElementById("pass1").style.borderColor = "#E34234";
            document.getElementById("pass2").style.borderColor = "#E34234";
        }
        else {
            alert("Passwords Match!!!");
            document.getElementById("regForm").submit();
        }
    }
</script>
2
Axel Amthor