Join the community and participate in the ongoing discussions. Join Now!
JavaScript

<!doctype html>

<html>

 <head>

 

    <title>

             sign-in page

    </title>

 

  <style  type="text/css">

 

    #signin_header{

                    background-                             color:grey;

                    text-align:center;

 

    }

 

    .form_block{

                 text-align:center;

                 border:solid grey;

                 border-width:100px;

                 margin-top:20%;

    }

    #fplace{

             text-align:center;

             font-size:50px;

    }

 

    body{

          background-color:darkgrey

    }

 

   </style>

 

 

 </head>

 

   <script

           type="text/javascript">

     function validation(){

       var usr=

    document.signinform.usrname.value;

     var pass1=

     document.signinform.pass1.value;

     var pass2=

    document.signinform.pass2.value;

 

     if(usr==null || usr="")

       {

        alert("please fill in the                     username");

         return false;

       }

     else

       if(pass1==null || pass1=="")

       {

          alert("please fill in the                    password");

         return false;

       }

        else if(pass1.length<8){

         alert("please the password must be at least 8 characters");

         return false;

       }

 

       else if(pass2.length<8){

         alert("please the password must be at least 8 characters");

         return false;

       }

 

       else if(!pass1==pass2)

       {

         alert("please the password                     you entered does not                     match");

         return false;

       }

     }

 

   </script>

 

<body>

 

  <div class="form_block">

 

  <h1 id="signin_header">

         Sign in here

  </h1>

 

    <p>

       <form

           name="signinform"

           method="post"

           action=""

           onsubmit="return                                 validation()"

          >

 

     <input type="text"name="usrname"placeholder="username" id="fplace">

 

         </br>  </br>  </br>

 

     <input type="email"name="email"placeholder="email address" id="fplace">

 

         </br>  </br>  </br>

 

     <input type="text"name="pass1"placeholder="enter password"id="fplace">

 

         </br>   </br>  </br>

 

     <input type="pass"name="pass2"placeholder="re-type password" id="fplace">

 

        </br>     </br>  </br>

<input type="submit"name="sub" id="fplace"value="Submit">

  </form>

 

  </p>

 </div>

 

 

 

 </body>

 

 

 

</html>

Okafor Isaac
29th Jun, 2020 @ 06:14 pm