When I clear, the data for gender and the rest doesn\'t clear. What can I do? <!
ID: 3717511 • Letter: W
Question
When I clear, the data for gender and the rest doesn't clear. What can I do?
<!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.threemonths[0].checked = false;
document.Application.sixmonths[1].checked = false;
document.Application.ninemonths[1].checked = false;
document.Application.yearly[1].checked = false;
document.Application.username[0].checked = false;
document.Application.password[1].checked = false;
document.Application.confirmpassword[2].checked = false;
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("Your pizza order has been submitted.");
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 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-family="Courier New">
<h1>Your Information</h1>
<p>
<h4>Details:</h4>
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>
Phone: <input name="phone" size="50" type="text">
<br>
Email: <input name="email" size="50" type="text">
<br>
</font>
</p>
<form name="feedback" action="#" method="post">
Your Gender:
<input type="radio" name="gender" value="male" id="m"> Male
<input type="radio" name="gender" value="Female" id="f"> Female
</form>
<br>
<p>
<h4>Membership:</h4> <font face="Courier New">
<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>
<h4>Create a Account:</h4>
<form name="username" method="POST">
<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">
</form>
</body>
</html>
Explanation / Answer
You should need to have only one form in html .. not form inside form ...
Here is code:
<!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("Your pizza order has been submitted.");
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 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" method="POST">
<h1>Your Information</h1>
<p>
<h4>Details:</h4>
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> Phone:
<input name="phone" size="50" type="text">
<br> Email:
<input name="email" size="50" type="text">
<br>
</font>
</p>
Your Gender:
<input type="radio" name="gender" value="male" id="m"> Male
<input type="radio" name="gender" value="Female" id="f"> Female
<br>
<p>
<h4>Membership:</h4>
<font face="Courier New">
<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>
<h4>Create a Account:</h4>
<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">
</form>
</body>
</html>
Related Questions
drjack9650@gmail.com
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.