Adil Khan
7 years ago
AdiKhanOfficial
#Web Engineering
Form Validation with JavaScript - Assignment
<html>
<head>
<title>Signup Form</title>
<style>
#myTable{margin-top:5%;width:400px;padding:20px;box-shadow: 0px 1px 7px 2px grey;}
input,select{width:100%;padding:5px}
button{padding:5px}
#alert{padding-bottom:15px;font-size:10px;color:red}
</style>
<script>
function validateForm(){
name = document.myForm.elements.name.value;
email = document.myForm.elements.email.value;
dob = document.myForm.elements.dob.value;
gender = document.myForm.elements.gender.value;
password = document.myForm.elements.password.value;
confirmPassword = document.myForm.elements.confirmPassword.value;
alertBox = document.getElementById("alert");
if(name == ""){
alertBox.innerHTML = "Please Enter Your Name!";
return false;
}
else if(name.length < 3){
alertBox.innerHTML = "Name is very short!";
return false;
}
else if(email == ""){
alertBox.innerHTML = "Please Enter Your Email Address!";
return false;
}
else if(dob == ""){
alertBox.innerHTML = "Please Select Your Date of Birth!";
return false;
}
else if(password == ""){
alertBox.innerHTML = "Please Enter Your Password!";
return false;
}
else if(password.length < 6){
alertBox.innerHTML = "Your Password is very short!";
return false;
}
else if(password != confirmPassword){
alertBox.innerHTML = "Password does not match!";
return false;
}
else {
return true;
}
}
</script>
</head>
<body>
<form action="" method="post" onsubmit="return validateForm();" name="myForm">
<table align="center" id="myTable">
<tr>
<th colspan="2"><h3>Signup</h3></th>
</tr>
<tr>
<th colspan="2" id="alert"></th>
</tr>
<tr>
<td>Full Name</td>
<td>
<input type="text" name="name" requirede/>
</td>
</tr>
<tr>
<td>Email</td>
<td>
<input type="email" name="email"requirede/>
</td>
</tr>
<tr>
<td>Date of Birth</td>
<td>
<input type="date" name="dob"requirede/>
</td>
</tr>
<tr>
<td>Gender</td>
<td>
<select name="gender" requirede>
<option value="Male">Male</option>
<option value="Female">Female</option>
</select>
</td>
</tr>
<tr>
<td>Password</td>
<td>
<input type="password" name="password" requirede/>
</td>
</tr>
<tr>
<td>Confirm Password</td>
<td>
<input type="password" name="confirmPassword" requirede/>
</td>
</tr>
<tr>
<td></td>
<td>
<button type="submit" name="signup">Signup</button>
</td>
</tr>
</table>
</form>
</body>
</html>
Form Validation with JavaScript - Assignment _ 0.html
Download: Form Validation with JavaScript - Assignment _ 0.html
Criminal Activities Detection and Control Monitoring System through Dr...
Police uses CCTV (Closed-circuit Television) and video camera (video surveillance area) ar...
Adil Khan
1 year ago
Shopping Assistant For Visually Impaired Community
Millions of people live in this world with disabilities to understand the environment due...
Adil Khan
1 year ago
Toddler diaries
A wrong selection leads to the bad health of a children so it must be ob...
Adil Khan
1 year ago
Experimental Study of Modulation Dynamics of Laser and Photodetector t...
Wireless communication providing ubiquitous and higher bandwidth services for access netwo...
Adil Khan
1 year ago
Online Car Rental Management System
As the internet improves the life of people, it also gives access to things that were inac...
Adil Khan
1 year ago