First of all, I was wondering what I can do so if I click submit after writing m
ID: 3717637 • Letter: F
Question
First of all, I was wondering what I can do so if I click submit after writing my email it asks me to enter my gender and so on (in order). Also, I cannot clear the last section (Account). Please help. Kindly Highlight or bold the Part of the Code you modified. It would be very helpful.
<!DOCTYPE html>
<html>
<head>
<!--
Final Project - Gym Website
Professor Archibald
New York City College of Technology
Application Form
Author: Sujoy Sarkar
Date: April 25, 2018
Filename: application.html
-->
<body text = "white"></body>
<p>
<img src="i.png" alt="Logo" width="800" height="400" />
<br/>
<a href="index.html"> About Us </a>
<a href="application.html"> Application Form </a>
<a href="direction.html"> Direction </a>
<title>Gym Application</title>
<script>
function doClear()
{
document.Application.fname.value = "";
document.Application.lname.value = "";
document.Application.address.value = "";
document.Application.city.value = "";
document.Application.state.value = "";
document.Application.zip.value = "";
document.Application.phone.value = "";
document.Application.email.value = "";
document.Application.gender[0].checked = false;
document.Application.gender[1].checked = false;
document.Application.membershipPeriod[0].checked = false;
document.Application.membershipPeriod[1].checked = false;
document.Application.membershipPeriod[2].checked = false;
document.Application.membershipPeriod[3].checked = false;
document.Application.name.value = "";
document.Application.pass.value = "";
document.Application.confirmpass.value = "";
return;
}
function doSubmit()
{
if (validateText() == false)
{
return;
}
if (validation() == false)
{
return;
}
if(validateForm()==false)
{
alert("Please choose your gender: Male or Female");
return;
}
if (validateRadio() == false)
{
alert("Please choose your membership type.");
return;
}
if (validateAccount() == false)
{
alert("Please create an account to complete your application.");
return;
}
alert("Thank You for becoming a member of Sarkar's Elite Fitness. You will get your membership card within 4-5 business days. You also need to check your email to verify the email address associated with your account. If you have any questions, comments or concerns, please feel free to contact us.");
return;
}
function validateText()
{
var customer = document.Application.fname.value;
if (customer.length == 0)
{
alert("Please enter your first name.");
return false;
}
var customer = document.Application.lname.value;
if (customer.length == 0)
{
alert("Please enter your last name.");
return false;
}
var address = document.Application.address.value;
if (address.length == 0)
{
alert("Please enter your address.");
return false;
}
var city = document.Application.city.value;
if (city.length == 0)
{
alert("Please enter your city name.");
return false;
}
var state = document.Application.state.value;
if (state.length == 0)
{
alert("Please enter your state.");
return false;
}
var zip = document.Application.zip.value;
if (zip.length == 0)
{
alert("Please enter your zip code.");
return false;
}
var email = document.Application.email.value;
if (email.length == 0)
{
alert("Please enter your email.");
return false;
}
return true;
}
function validateForm(form)
{
if ((document.getElementById("m").checked == false) && (document.getElementById("f").checked == false))
{
return false;
}
return true;
}
function validation()
{
var a = document.Application.phone.value;
if (a == "")
{
alert("Please enter the phone number:");
document.Application.phone.focus();
return false;
}
var a = document.username.name.value;
if (a == "")
{
alert("Please enter your username:");
document.username.name.focus();
return false;
}
return true;
}
function validateRadio()
{
var getMembershipPeriod = document.getElementsByName("membershipPeriod");
for (var i = 0; i < getMembershipPeriod.length; i++)
{
if (getMembershipPeriod[i].checked)
{
return true;
}
}
return false;
}
function validateAccount()
{
var username = document.getElementById("username").value;
var password = document.getElementById("pass").value;
var cPassword = document.getElementById("confirmpass").value;
if (username == '')
{
alert("Please enter your username");
return false;
}
else if(username.length<6)
{
alert("Username can't be less than 6.");
return false;
}
if (password == '')
{
alert("Please enter your password");
return false;
}
else if(password.length<6)
{
alert("Password can't be less than 6.");
return false;
}
if (cPassword == '')
{
alert("Please re-enter your password");
return false;
}
else if(cPassword.length<6)
{
alert("Password can't be less than 6.");
return false;
}
else if (password != cPassword)
{
alert("Confirm Password didn't match.");
return false;
}
return true;
}
</script>
</head>
<body>
<form name="Application"> <font face="Courier New">
<b><center><h1>Your Information</h1></center></b>
<p>
<u><h4>Details:</h4></u>
First Name: <input name="fname" size="50" type="text" >
<br>
Last Name: <input name="lname" size="50" type="text">
<br>
Address: <input name="address" size="50" type="text">
<br>
City: <input name="city" size="50" type="text">
<br>
State: <input name="state" size="50" type="TEXT">
<br>
Zip: <input name="zip" size="5" type="text">
<br>
Email: <input name="email" size="50" type="text">
<br>
Phone: <input name="phone" size="50" type="text">
<br>
</font>
</p>
<form name="feedback" action="#" method="post"> <font face="Courier New">
Your Gender:
<br>
<input type="radio" name="gender" value="male" id="m"> Male
<input type="radio" name="gender" value="Female" id="f"> Female
</form>
<br>
<p>
<u><h4>Membership:</h4></u>
<input name="membershipPeriod" type="radio"> 3 Months - $30.00
<br>
<input name="membershipPeriod" type="radio"> 6 Months - $60.00
<br>
<input name="membershipPeriod" type="radio"> 9 Months - $90.00
<br>
<input name="membershipPeriod" type="radio"> Yearly - $120.00
<br>
</font>
</p>
<p>
<form name="username" method="POST"><font face="Courier New">
<u><h4>Create a Account:</h4></u>
<tr>
<td>Create Username:</td>
<td><input type="text" id="username" name="name" pattern=".{8,12}" required="required"></td>
</tr>
<br>
<tr>
<td> Password: </td>
<td><input type="password" id="pass" name="pass" pattern=".{8,12}" required="required"></td>
</tr>
<br>
<tr>
<td> Confirm Password: </td>
<td> <input type="password" id="confirmpass" name="confirmpass" pattern=".{8,12}" required="required"> </td>
</tr>
</p>
<input type="button" value="Submit Order">
<input type="button" value="Clear Entries">
<hr/>
<address>
<font size="6" font color:white><b>Sarkar's Elite Fitness</b>
<br>
46-01 Skillman Ave.
<br>
Sunnyside, NY 11104
<br>
1 (347) 667-1848 </font>
<body link="white">
<p><a href="#top">Top of the Page</a></p>
</form>
</body>
</html>
Explanation / Answer
<!DOCTYPE html>
<html>
<head>
<!--
Final Project - Gym Website
Professor Archibald
New York City College of Technology
Application Form
Author: Sujoy Sarkar
Date: April 25, 2018
Filename: application.html
-->
<body text=""></body>
<p>
<img src="i.png" alt="Logo" width="800" height="400" />
<br/>
<a href="index.html"> About Us </a>
<a href="application.html"> Application Form </a>
<a href="direction.html"> Direction </a>
<title>Gym Application</title>
<script>
function doClear() {
document.Application.fname.value = "";
document.Application.lname.value = "";
document.Application.address.value = "";
document.Application.city.value = "";
document.Application.state.value = "";
document.Application.zip.value = "";
document.Application.phone.value = "";
document.Application.email.value = "";
document.Application.gender[0].checked = false;
document.Application.gender[1].checked = false;
document.Application.membershipPeriod[0].checked = false;
document.Application.membershipPeriod[1].checked = false;
document.Application.membershipPeriod[2].checked = false;
document.Application.membershipPeriod[3].checked = false;
document.Application.name.value = "";
document.Application.pass.value = "";
document.Application.confirmpass.value = "";
return;
}
function doSubmit() {
if (validateText() == false) {
return;
}
if (validation() == false) {
return;
}
if (validateForm() == false) {
alert("Please choose your gender: Male or Female");
return;
}
if (validateRadio() == false) {
alert("Please choose your membership type.");
return;
}
if (validateAccount() == false) {
alert("Please create an account to complete your application.");
return;
}
alert("Thank You for becoming a member of Sarkar's Elite Fitness. You will get your membership card within 4-5 business days. You also need to check your email to verify the email address associated with your account. If you have any questions, comments or concerns, please feel free to contact us.");
return;
}
function validateText() {
var customer = document.Application.fname.value;
if (customer.length == 0) {
alert("Please enter your first name.");
return false;
}
var customer = document.Application.lname.value;
if (customer.length == 0) {
alert("Please enter your last name.");
return false;
}
var address = document.Application.address.value;
if (address.length == 0) {
alert("Please enter your address.");
return false;
}
var city = document.Application.city.value;
if (city.length == 0) {
alert("Please enter your city name.");
return false;
}
var state = document.Application.state.value;
if (state.length == 0) {
alert("Please enter your state.");
return false;
}
var zip = document.Application.zip.value;
if (zip.length == 0) {
alert("Please enter your zip code.");
return false;
}
var email = document.Application.email.value;
if (email.length == 0) {
alert("Please enter your email.");
return false;
}
return true;
}
function validateForm() {
if ((document.getElementById("m").checked == false) && (document.getElementById("f").checked == false)) {
return false;
}
return true;
}
function validation() {
// changed the way the validation was being done
// also, removed the validation for username
// as it was being validated in the validateAccount() method
var phone = document.getElementsByName('phone');
if (phone.value == "") {
alert("Please enter the phone number:");
phone.focus();
return false;
}
return true;
}
function validateRadio() {
var getMembershipPeriod = document.getElementsByName("membershipPeriod");
for (var i = 0; i < getMembershipPeriod.length; i++) {
if (getMembershipPeriod[i].checked) {
return true;
}
}
return false;
}
function validateAccount() {
var username = document.getElementById("username").value;
var password = document.getElementById("pass").value;
var cPassword = document.getElementById("confirmpass").value;
if (username == '') {
alert("Please enter your username");
return false;
}
else if (username.length < 6) {
alert("Username can't be less than 6.");
return false;
}
if (password == '') {
alert("Please enter your password");
return false;
}
else if (password.length < 6) {
alert("Password can't be less than 6.");
return false;
}
if (cPassword == '') {
alert("Please re-enter your password");
return false;
}
else if (cPassword.length < 6) {
alert("Password can't be less than 6.");
return false;
}
else if (password != cPassword) {
alert("Confirm Password didn't match.");
return false;
}
return true;
}
</script>
</head>
<body>
<form name="Application">
<font face="Courier New">
<b>
<center>
<h1>Your Information</h1>
</center>
</b>
<p>
<u>
<h4>Details:</h4>
</u>
First Name:
<input name="fname" size="50" type="text">
<br> Last Name:
<input name="lname" size="50" type="text">
<br> Address:
<input name="address" size="50" type="text">
<br> City:
<input name="city" size="50" type="text">
<br> State:
<input name="state" size="50" type="TEXT">
<br> Zip:
<input name="zip" size="5" type="text">
<br> Email:
<input name="email" size="50" type="text">
<br> Phone:
<input name="phone" size="50" type="text">
<br>
</font>
</p>
Your Gender:
<br>
<input type="radio" name="gender" value="male" id="m"> Male
<input type="radio" name="gender" value="Female" id="f"> Female
<br>
<p>
<u>
<h4>Membership:</h4>
</u>
<input name="membershipPeriod" type="radio"> 3 Months - $30.00
<br>
<input name="membershipPeriod" type="radio"> 6 Months - $60.00
<br>
<input name="membershipPeriod" type="radio"> 9 Months - $90.00
<br>
<input name="membershipPeriod" type="radio"> Yearly - $120.00
<br>
</font>
</p>
<p>
<!-- <form name="username" method="POST">-->
<font face="Courier New">
<u>
<h4>Create a Account:</h4>
</u>
<tr>
<td>Create Username:</td>
<td>
<input type="text" id="username" name="name" pattern=".{8,12}" required="required">
</td>
</tr>
<br>
<tr>
<td> Password: </td>
<td>
<input type="password" id="pass" name="pass" pattern=".{8,12}" required="required">
</td>
</tr>
<br>
<tr>
<td> Confirm Password: </td>
<td>
<input type="password" id="confirmpass" name="confirmpass" pattern=".{8,12}" required="required"> </td>
</tr>
</p>
<input type="button" value="Submit Order">
<!--<input type="button" value="Clear Entries">-->
<!-- The Reset button will clear all the entries of the form
no need to manually clear the controls -->
<input type="reset" value="Clear Entries">
<hr />
<address>
<font size="6" font color:white>
<b>Sarkar's Elite Fitness</b>
<br> 46-01 Skillman Ave.
<br> Sunnyside, NY 11104
<br> 1 (347) 667-1848 </font>
<p>
<a href="#top">Top of the Page</a>
</p>
</body>
</html>
Related Questions
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.