Friday 1 March 2013

create validation on TextBox Field,CheckBox,DropDown using Java Script




How to create validation on TextBox Field,CheckBox,DropDown using JavaScript

**************************************************************


<html>
<head>
<script type="text/javascript">

    function val()
     {
        //alert("kush");
        var un = document.forms['myform']['username'].value;
        var fn = document.forms['myform']['fathername'].value;
        var e1 = document.forms['myform']['email'].value;
        var p = document.forms['myform']['password'].value;
        var cp = document.forms['myform']['cpassword'].value;
        var cs = document.forms['myform']['city'].value;
      
        if (un == null || un == "") {
            alert('Please enter user name');
            return false;
        }

        if (fn == null || fn == "") {
            alert('Please enter father name');
            return false;
        }

        if (e1 == null || e1 == "") {
            alert('Please enter email name');
            return false;
        }

        if (p == null || p == "") {
            alert('please enter password');
            return false;
        }
        if (cp == null || cp == "") {
            alert('please enter confirm password');
            return false;
        }
        if (cs == null || cs == "") {
            alert('Please Select City');
            return false;
        }

  //coding for how to validate checkbox List in Java Script............

        var chks = document.getElementsByName('qulification[]');
        var checkCount = 0;
        for (var i = 0; i < chks.length; i++) {
            if (chks[i].checked) {
                checkCount++;
            }
        }
        if (checkCount < 2) {
            alert("Please select at least two.");
            return false;
        }

      //coding for how to compare validate password and Confirm Password  in Java Script............

        if (p != cp) {
            alert("Password and Confirm Password is not match");
        }
        return true;
    }
</script>

</head>
<body>
<form action="tiwari.html" method="post" name="myform" onsubmit="return val()">
<table border="5px" width="100%">
<tr><td>Name:</td><td><input type="text" name="username"></td><td></td></tr>
<tr><td>Father Name</td><td><input type="text" name="fathername"></td><td></td></tr>
<tr><td>EmailId</td><td><input type="text" name="email"></td><td></td></tr>
<tr><td>Password</td><td><input type="password" name="password"></td><td></td></tr>
<tr><td>Confirm Password</td><td><input type="password" name="cpassword"></td><td></td></tr>
<tr><td>Qulification</td><td>
<input type="checkbox" name="qulification[]" value="High School">High School
<input type="checkbox" name="qulification[]" value="Intermidiate">Intermidiate
<input type="checkbox" name="qulification[]" value="Graduation">Graduation
<input type="checkbox" name="qulification[]" value="Post Graduation">Post Graduation
</td><td></td></tr>
<tr><td>Current City</td><td><select name="city" id="" width="500px">
        <option value="">Select</option>
        <option value="Delhi">Delhi</option>
        <option value="Noida">Noida</option>
        <option value="Varanasi">Varanasi</option>
        <option value="Ghaziabd">Ghaziabad</option>
      </select></td><td></td></tr>
<tr><td><input type="submit" name="sub"></td><td></td><td></td></tr>


</table>
</form>
</body>
</html>



0 comments:

Post a Comment