Form Validations – JavaScript

Table of Contents

All Small Letters

JavaScript Code

				
					<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Small Letter Validations</title>
</head>

<body>
    <input type="text" id="s1">
    <p id="g1"></p>
    <input type="button" onclick="cc()" value="Submit">
    <script>
    
    function cc()
        {    
            h=0;
            a=document.getElementById("s1").value;
            
            for(j=0;j<=a.length;j++){
            b=a.charCodeAt(j);
            
            if(b>=97 && b<=122){
                h++;
            }
            
            }
            if (h==a.length){
            document.getElementById("g1").innerHTML="All are Small Letters";        
            }
            else{document.getElementById("g1").innerHTML="No Small Letters";}
        }
    
    </script>
</body>
</html>
				
			

Complex Password

JavaScript Code

				
					<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Complex Password Validation</title>
</head>

<body>
<p>Checking if Password Contains </p>
<ul>
<li>Minimum one Special Character</li>
<li>Minimum one Lower Case Alphabet</li>
<li>Minimum one Upper Case Alphabet</li>
<li>Minimum one Numerical Value</li>
</ul>
    <input type="text" id="s1">
    <p id="g1"></p>
    <input type="button" onclick="cc()" value="Submit">
    <script>
    function cc()
        {    
        a=document.getElementById("s1").value;
        c=0;
        d=0;
        e=0;
        f=0;
        
    for(b=0;b<a.length;b++)
        {
            g=a.charCodeAt(b);
        
            if(g>=97 && g<=122)
                {
                c=1;    
                }
            else if(g>=65 && g<=90)
                {
                d=1;    
                }
            else if(g>=48 && g<=57)
                {
                e=1;    
                }
            else if((g>=33 && g<=47) || (g>=58 && g<=64) || (g>=91 && g<=96) || (g>=123 && g<=126))
                {
                f=1;    
                }
        }
        
        if((c==0) || (d==0) || (e==0) || (f==0))
            {
                document.getElementById("g1").innerHTML="please enter minimum 1 lower case characte and 1 upper case and 1 special character and i numerical value";
            }
        else{
            document.getElementById("g1").innerHTML="correct";
        }
        }
    </script>
    <!--
65 to 90  A to Z
97 to 122 a to z
48 to 57  0 to 9
special character  33 to 47 and 58 to 64  and 91 to 96 and 123 to 126
-->
</body>
</html>
				
			

Confirm Password

HTML Code

				
					<form id="form1">

<input type="password" name="passward" id="passward" onblur="return formvalipassward()"/>

<input type="password" name="passwardconfirm" id="passwardconfirm" onblur="return formvaliconfirm()"/>

</form>
				
			

JavaScript Code

				
					function formvaliconfirm(){
    var pass=document.form1.passward.value;
    var passconfirm=document.form1.passwardconfirm.value;
    if
        (!(pass==passconfirm)){alert("please enter a correct passward")}
    
}
				
			

Email Validation

HTML Code

				
					<form id="form1">

<input type="text" name="emailid" id="emailid" onblur="return formvaliemail()"/>
				
			

JavaScript Code

				
					function formvaliemail(){
    var email=document.form1.emailid.value;
    var c=email.indexOf("@");
    var d=email.indexOf(".");
    var e=email.lastIndexOf(".");
    var f=email.length;
    var g=e+4;
    var j=c+5;
if
        (email==""){alert("please enter a value")}
        else if(c==-1)
        {alert("please enter a value with @")
            }
    else if(d==-1)
        {alert("please enter a value with .")
            }
else if(e<c)
        {alert("please enter@ before dot(.)")
            }
else if(g>f)
        {alert("please enter3 values after last dot(.)")
            }
            else if(j>e)
        {alert("please enter5 values after@ & last dot(.)")
            }
}
				
			

Math Function in Form Validations

1. length
2. indexOf
3. lastIndexOf
4. charCodeAt
5. charAt
6. Nan

Mobile validation

HTML Code

				
					<input type="text" name="mobile" id="mobile" onblur="return formvalimobile()"/>
				
			

JavaScript Code

				
					function formvalimobile(){
    var mob=document.form1.mobile.value;
if
        (mob==""){alert("please enter a value")}
    else if
        (isNaN(mob)){alert("please enter a numerical value")}

    else if(!(mob.length==10)){alert("please enter a value of 10 digit for India")
    }
    else if(!(mob.charAt(0)==9))
    {alert("please enter a first digit with 9")
        }
       else if(!(mob.charAt(1)==9))
    {alert("please enter a second digit with 9")
        }
}
				
			

Name validation

HTML Code

				
					<input type="text" name="username" id="username" onblur="return formvaliname()"/>
				
			

JavaScript Code

				
					function formvaliname(){
        var nm=document.form1.username.value;
    if
        (nm==""){alert("please enter a value")}
    else if    
    (!(isNaN(nm))){alert("please enter first letter alphabetical")}
else if
        (nm.length<5){alert("please enter minimum 5 letters")}    
    else if
        (nm.indexOf(" ")==-1){alert("please enter sur name")}    
}
				
			

Password Validation

HTML Code

				
					<input type="password" name="passward" id="passward" onblur="return formvalipassward()"/>
				
			

JavaScript Code

				
					function formvalipassward(){
    var pass=document.form1.passward.value;
    if
        (pass==""){alert("please enter a value")}
else if
        (pass.length<8){alert("please enter minimum 8 letters")}
    
}
				
			

Take Your Free Live Demo Class Now

You May Also Like

Enter Your DETAILS BELOW

To Get Complete Information or We Will Call You

We Will Send You the Course Fees Details In Below Number

Enter Your DETAILS BELOW

We Will Call Back You Shortly

Enter Your DETAILS BELOW

We Will Call Back You Shortly

Enter Your DETAILS BELOW

Enter Your DETAILS BELOW TO take

free demo class