<!DOCTYPE html>

<html lang="en">

<head>

    <link rel="stylesheet" href="form.css">

    

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

    <script>

        function validate(){

            var a=document.getElementById('a1').value;

            var b=document.getElementById('a2').value;

            var c=document.getElementById('a3').value;

            var d=document.getElementById('a4').value;

            var e=document.getElementById('a5').value;

           

             if(a==""){

                 document.getElementById('message').innerHTML="** Please Fill Username "

                 return false;

             }

             if(a.length<3){

                document.getElementById('message').innerHTML="**Username must be 3 character"

                 return false;


             }

        

            if(b==""){

                 document.getElementById('m1').innerHTML="** Please Fill Mobile Number"

                 return false;  

                    }

                    if(isNaN(b)){

                 document.getElementById('m1').innerHTML="** Enter Only Numeric value"

                 return false;  

                    }

                    if(b.length>10){

                 document.getElementById('m1').innerHTML="** mobile number must be 10 digit"

                 return false;  

                    }

                    if(b.length<10){

                 document.getElementById('m1').innerHTML="** mobile number must be 10 digit"

                 return false;  

                    }

                    if((b.charAt(0)!=9) && (b.charAt(0)!=8) && (b.charAt(0)!=7) && (b.charAt(0)!=6)){

                        document.getElementById('m1').innerHTML="** First number shoud be start 9,8,7,6"

                        return false;

                    }

                    if(c==""){

                        document.getElementById('m2').innerHTML="** Please Enter Email Id"

                        return false;

                    }

                    if(c.indexOf('@')<=0){

                        document.getElementById('m2').innerHTML="** Invalid Email"

                        return false;

                    }

                    if((c.charAt(c.length-4)!='.') && (c.charAt(c.length-3)!='.')){

                        document.getElementById('m2').innerHTML="Invalid Email"

                        return false;

                    }

                    if(d==""){

                        document.getElementById('m3').innerHTML="** Please Enter Password"

                        return false;

                    }

                    if(d.length<8){

                        document.getElementById('m3').innerHTML="** Password Length must be 8 character"

                        return false;

                    }

                    if(d!=e){

                        document.getElementById('m3').innerHTML="** Passwors not match"

                        return false;

                    }

                    

                    

        return true;

                }

    </script>

</head>

<body>

    <div id="outer">

        <div id="top"> <span> Register here <hr style="margin-top: -30px;width: 120px;

        margin-left: 65px;background-color: orange;height: 4px;border: none;

        border-radius: 5px;"></span></div>

        <div id="left">

            <form action="test2.html" method="" onsubmit="return validate()">

            Username: <br>

            <input type="text" id="a1"> <br>

            <span id="message" class="sp"></span>

            <br> 

            Mobile Number: <br>

            <input type="text" id="a2"> <br> 

            <span id="m1" class="sp"></span>

            <br>

            Email: <br>

            <input type="text" id="a3"> <br>

            <span id="m2" class="sp"></span>

            <br>

            Password: <br>

            <input type="password" id="a4"> <br> 

            <span id="m3" class="sp"></span>

            <br>

            Confirm Password: <br>

            <input type="password" name="" id="a5"> <br>

            <span id="m3" class="sp"></span>

            <br> <br>

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

        </form>

            


   

        </div>

        

    </div>

</body>


</html>


Javascript Validation