validate form in contact.html. If the form has been validated, show an aler box that displays the data entered and asks the user if that data entered is correct.

this post and the follow post for help people for javascript assessment not for the real world

Q1. validate form in contact.html. If the form has been validated, show an aler box that displays the data entered and asks the user if that data entered is correct. If yes, thanks the visitoer and submit the form. If no,prevent the form from submitting and display detailed error messages for the incorrect fields.

the contact.html page just like this:

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”&gt;
<html xmlns=”http://www.w3.org/1999/xhtml”&gt;
<head>
<title>Beatmap Product Enquiry Form</title>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″ />
<script type=”text/javascript” src=”js/share.js”></script>
<script language=”javascript” src=”js/all.js”></script>
<script type=”text/javascript” src=”js/autochange.js”></script>
<link href=”styles/style.css” rel=”stylesheet” type=”text/css” />
<style type=”text/css”>
.title {
margin-bottom:10px;
}
#rightside {font-size:10px;
}
br{line-height:3;
}
#header br{line-height:1;
}
fieldset{width:350px; margin:0 50px; padding:20px;
}
legend {font:900 1.2em helvetica, verdana, sans-serif;color:#fff;
}
#picture1{background-image:url(images/product/rihanna.jpg);
}
#picture2{background-image:url(images/product/staticx.jpg);
}
</style>
</head>
<body>
<div id=”central”>
<div id=”header”>
<div id=”login”>
</div>
</div>
<ul id=”navlist”>
<li><a id=”n1″ href=”index.htm”>Home</a></li>
<li><a id=”n2″ href=”products.htm”>Products</a></li>
<li><a id=”n3″ href=”reviews.htm”>Reviews</a></li>
<li><span id=”current”><a id=”n4″ href=”contact.htm”>Enquiries</a></span></li>
</ul>
<div id=”content” style=”background-image:none;”>
<div id=”leftside”>
<h3>Featured Artist</h3>
<div id=”picture1″></div>
<h3>Featured Artist</h3>
<div id=”picture2″></div>
</div>
<div id=”rightside”>
<form id=”project” action=”#” onsubmit = “return validateForm()”>
<fieldset>
<legend>Contact Details</legend>
<label for=”txtname”>Your Name:</label> <input type=”text” name=”txtname” id=”txtname”/><br/>
<label for=”txtemail”>Email:</label> <input type=”text” name=”txtemail” id=”txtemail”/><br/>
<label for=”txtartist”>Artist:</label> <input type=”text” name=”txtartist” id=”txtartist”/><br/>
<label for=”txtalbum”>Song / Album:</label> <input type=”text” name=”txtalbum” id=”txtalbum”/><br/>
<label for=”txtcomments”>Comments:</label> <textarea name=”txtcomments” id=”txtcomments” cols=”30″ rows=”20″></textarea><br/>
<input type=”submit” id=”btnSubmit” name=”btnsubmit” value=”Send Enquiry”/>
</fieldset>
</form>

</div>
<div id=”footer”> <p>&copy; Beatmap 2013</p></div>
</div>
</div>
<script language=”javascript” src=”js/init.js”></script>

</body>
</html>

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s