Web Application Assignment no 3
Name: Anisa Bibi
Roll No: 20BSCS021
Create a web page with the above layout. Perform the following validations:
i. First name and last name should not be same.
ii. Email address much contain @ and end with .com
iii. email entered both times should be same.
iv. Confirm box should display ok message when all values entered are valid
Answer:
<!DOCTYPE HTML>
<HTML>
<HEAD>
<title>Assign Q3</title>
</HEAD>
<body>
<form NAME="data" METHOD="post" ACTION="mailto:[email protected]"
OnSubmit="return validate_form()";>
Your First Name:<input type="text" name="fname"><br>
Your Last Name:<input type="text" name="lname"><br>
Your Email:<input type="text" name="email"><br>
Re-enter Email:<input type="text" name="reemail"><br>
New Password:<input type="password" name="password"><br>
<input type="submit" name="submit" value="Accept" onClick="return validate(form)";
onclick="matchName()";onclick="matchName()">
</form>
<script LANGUAGE="JavaScript">
function matchMails() {
var mail1 = document.getElementById("mail1");
var mail2 = document.getElementById("mail2");
var pw1 = document.getElementById("pswd1").value;
if(mail1 != mail2)
{
alert("Mails did not match");
} else {
return true;
}
if(pw1 == "") {
document.getElementById("message1").innerHTML = "**Fill the password please!";
return false;
}
//check empty confirm password field
if(pw1.length > 15) {
document.getElementById("message1").innerHTML = "**Password length must not
exceed 15 characters";
return false;
}
function matchName() {
var Fname = document.getElementById("Fname");
var Lname = document.getElementById("Lname");
if(Fname != Lname)
{
alert(" Fname and Lname didn't match");
} else {
alert("Fname and Lname match");
}
function validate(formCheck)
{
var mail=formCheck.email.value
if(mail.indexOf("@")==-1 || mail.indexOf(".com")==-1 )
{
alert("Please type a valid email:");
formCheck.email.focus();
return false;
}
return true;
}
function validate_form()
{
valid=true;
if(document.data.fname.value==document.data.lname.value)
{
alert("Your first name & last name is same ,Please re-enter");
valid=false;
}
if(document.data.email.value!=document.data.reemail.value)
{
alert("Email is not matching, It should be same");
valid=false;
}
if(valid==true)
confirm("OK");
return valid;
}
</script>
</body>
</HTML>