Write a JavaScript program to validate a form which consist of name, Age, address, email id, hobby(checkbox), gender(radio button), country (dropdown).
CODING:
<!DOCTYPE html>
<html>
<head>
<title></title>
<script>
function validateform(){
var name=document.myform.name.value;
var lname=document.myform.lname.value;
var address=document.myform.address.value;
var x=document.myform.email.value;
var atposition=x.indexOf("@");
var dotposition=x.lastIndexOf(".");
var password=document.myform.password.value;
var gender=document.myform.gender.value;
var country=document.myform.country.value;
if (myform.name==null || name=="" && myform.lname==null || lname==""){
alert("Input First & Last name.");
return false;
}
if(address.length==0){
alert("address can't be blanked.");
return false;
}
if (atposition<1 || dotposition<atposition+2 || dotposition+2>=x.length){
alert("Please enter a valid e-mail address \n atpostion:"+atposition+"\n dotposition:"+dotposition);
return false;
}
if(password.length<8){
alert("Password must be at least 8 characters long.");
return false;
}
if(myform.gender[0].checked==false && myform.gender[1].checked==false){
alert("Select Your Gender");
return false;
}
if(myform.country.value=='0'){
alert("Select Your Country");
return false;
}
if(myform.sing.checked==false && myform.danc.checked==false && myform.pain.checked==false){
alert("Select Your hobby");
return false;
}
}
</script>
</head>
<body align="center">
<h1><b><i><u>REGISTRATION FORM</u></i></b></h1><HR>
<form name="myform" onsubmit="return validateform()">
First Name:<input type="text" name="name" placeholder="Your First Name"><br><br>
Last Name:<input type="text" name="lname" placeholder="Your Last Name"><br><br>
Address<br>
<textarea rows="2" cols="35" name="address" placeholder="Enter Your Address"></textarea><br><br>
Email:<input type="text" name="email" placeholder="Example@gmail.com"><br><br>
Password:<input type="password" name="password" placeholder="Input Gmail Password."><br><br>
Gender:<input type="radio" name="gender" value="male">MALE<input type="radio" name="gender" value="female">FEMALE<br><br>
<select name="country">dsff<option value="1">India</option><option value="2">U.S.A.</option><option value="3">U.A.E.</option><option selected value="0">Select Your Country</option></select><br><br>
Hobby:<br>
<input type="checkbox" name="sing" >Singing<br>
<input type="checkbox" name="danc" >Dancing<br>
<input type="checkbox" name="pain" >Painting<br><br>
<div align="center"><input type="submit" value="SUBMIT"> <input type="reset" value="CANCEL" >
</form>
</body>
</html>
CODING:
<!DOCTYPE html>
<html>
<head>
<title></title>
<script>
function validateform(){
var name=document.myform.name.value;
var lname=document.myform.lname.value;
var address=document.myform.address.value;
var x=document.myform.email.value;
var atposition=x.indexOf("@");
var dotposition=x.lastIndexOf(".");
var password=document.myform.password.value;
var gender=document.myform.gender.value;
var country=document.myform.country.value;
if (myform.name==null || name=="" && myform.lname==null || lname==""){
alert("Input First & Last name.");
return false;
}
if(address.length==0){
alert("address can't be blanked.");
return false;
}
if (atposition<1 || dotposition<atposition+2 || dotposition+2>=x.length){
alert("Please enter a valid e-mail address \n atpostion:"+atposition+"\n dotposition:"+dotposition);
return false;
}
if(password.length<8){
alert("Password must be at least 8 characters long.");
return false;
}
if(myform.gender[0].checked==false && myform.gender[1].checked==false){
alert("Select Your Gender");
return false;
}
if(myform.country.value=='0'){
alert("Select Your Country");
return false;
}
if(myform.sing.checked==false && myform.danc.checked==false && myform.pain.checked==false){
alert("Select Your hobby");
return false;
}
}
</script>
</head>
<body align="center">
<h1><b><i><u>REGISTRATION FORM</u></i></b></h1><HR>
<form name="myform" onsubmit="return validateform()">
First Name:<input type="text" name="name" placeholder="Your First Name"><br><br>
Last Name:<input type="text" name="lname" placeholder="Your Last Name"><br><br>
Address<br>
<textarea rows="2" cols="35" name="address" placeholder="Enter Your Address"></textarea><br><br>
Email:<input type="text" name="email" placeholder="Example@gmail.com"><br><br>
Password:<input type="password" name="password" placeholder="Input Gmail Password."><br><br>
Gender:<input type="radio" name="gender" value="male">MALE<input type="radio" name="gender" value="female">FEMALE<br><br>
<select name="country">dsff<option value="1">India</option><option value="2">U.S.A.</option><option value="3">U.A.E.</option><option selected value="0">Select Your Country</option></select><br><br>
Hobby:<br>
<input type="checkbox" name="sing" >Singing<br>
<input type="checkbox" name="danc" >Dancing<br>
<input type="checkbox" name="pain" >Painting<br><br>
<div align="center"><input type="submit" value="SUBMIT"> <input type="reset" value="CANCEL" >
</form>
</body>
</html>
Comments
Post a Comment