Scribd Logo
Importer

Bienvenue sur Scribd !

  • Registration

    Transféré par

    Ana Gligorić
    12 vues3 pages
    registration form

    Copyright

    © © All Rights Reserved

    Formats disponibles

    TXT, PDF, TXT ou lisez en ligne sur Scribd

    Avez-vous trouvé ce document utile ?

    Ce contenu est-il inapproprié ?

    Signaler ce document
    registration form

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme TXT, PDF, TXT ou lisez en ligne sur Scribd
    Signaler comme contenu inapproprié
    12 vues3 pages

    Registration

    Transféré par

    Ana Gligorić
    registration form

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme TXT, PDF, TXT ou lisez en ligne sur Scribd
    Signaler comme contenu inapproprié
    sur 3

    !

    DOCTYPE html>
    <html>
    <head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="style.css"> </link>
    </head>
    <body>
    <div class="container">
    <img src="slika.png">
    <form method="POST" action="index.html" onsubmit="return Validate()"
    name="vform">
    <div class="form-input">
    <input type="text" name="username" placeholder = "Enter Username">
    <div id="name_error" class="val_error"></div>
    </div>
    <div class="form-input">
    <input type="text" name="email" placeholder = "Enter Email">
    <div id="email_error" class="val_error"></div>
    </div>
    <div class="form-input">
    <input type="password" name="password" placeholder = "Enter password">
    </div>
    <div>
    <div class="form-input">
    <input type="password" name="password_confirmation" placeholder =
    "Password confirmation">
    <div id="password_error" class="val_error"></div>
    </div>
    <div>
    <input type="submit" name="register" value="Sing in" class="btn-
    login"><br>
    <a href="#">Forget password?</a>
    </div>
    </form>
    </div>
    </body>
    </html>
    <script type="text/javascript">
    //getting al input text objects
    var username = document.forms["vform"]["username"];
    var email = document.forms["vform"]["email"];
    var password = document.forms["vform"]["password"];
    var password_confirmation = document.forms["vform"]
    ["password_confirmation"];

    //getting all error display objects


    var name_error = document.getElementById("name_error");
    var email_error = document.getElementById("email_error");
    var password_error = document.getElementById("password_error");

    //setting all event listener


    username.addEventListener("blur", nameVerify, true);
    email.addEventListener("blur", emailVerify, true);
    password.addEventListener("blur", passwordVerify, true);

    //validation function
    function Validate(){
    //username validation
    if(username.value == ""){
    username.style.border = "1px solid red";
    name_error.textContent = "Username is required";
    username.focus();
    return false;
    }
    //email validation
    if(email.value == ""){
    email.style.border = "1px solid red";
    email_error.textContent = "Email is required";
    email.focus();
    return false;
    }
    //password validation
    if(password.value == ""){
    password.style.border = "1px solid red";
    password_error.textContent = "Password is required";
    password.focus();
    return false;
    }

    //check if the two password match

    if(password.value!= password_confirmation.value){
    password.style.border = "1px solid red";
    password_confirmation.style.border = "1px solid red";
    password_error.innerHTML = "The two password do not match";
    return false;
    }

    if(password.value!= password_confirmation.value){
    password.style.border = "1px solid red";
    password_confirmation.style.border = "1px solid red";
    password_error.innerHTML = "The two password do not match";
    return false;
    }
    }

    //event handler function

    function nameVerify(){
    if(username.value !="" ){

    username.style.border = "1px solid #5E6E66";


    name_error.innerHTML = "";
    return true;

    }
    }

    function emailVerify(){
    if(email.value !="" ){

    email.style.border = "1px solid #5E6E66";


    email_error.innerHTML = "";
    return true;

    }
    }
    function passwordVerify(){
    if(password.value !="" ){

    password.style.border = "1px solid #5E6E66";


    password_error.innerHTML = "";
    return true;

    </script>

    Vous aimerez peut-être aussi