Add a form validation code similar to the image below <!DOCTYPE html> <html> <he
ID: 3581642 • Letter: A
Question
Add a form validation code similar to the image below
<!DOCTYPE html>
<html>
<head>
<title>CityTech CC</title>
</head>
<a name="top"></a>
<u><center><h1>Gym Membership Form</h1></center></u>
<style>
h1 {
margin-left:30px;
}
</style>
<body>
<font face="Courier New">
<form action="http://www.WebsiteDevelopmentBook.com/FormEcho.php" method="post">
<fieldset>
<legend><h1>Member Details</h1></legend>
<font face="Courier New">
First Name: <input type="text" name="First Name" size="60"/>
Last Name: <input type="text" name="Last Name" size="60"/></p>
Birth Date: <input type="text" name="Birth Date" size="38"/>
Gender:
Female<input type="checkbox" name="Female"/>
Male<input type="checkbox" name="Male"/></p>
Mailing Address: <input type="text" name="Mailing Address" size="60"/></p>
City: <input type="text" name="City" size="38"/>
State: <input type="text" name="State" size="25"/>
Zip Code: <input type="text" name="Zip Code" size="25"/></p>
Telephone: <input type="text" name="Telephone" size="40"/>
Email: <input type="text" name="Email" size="38"/></p>
Emergency Contact Name:<input type="text" name="Emergency Contact Name" size="40"/>
Emergency Contact Phone: <input type="text" name="Emergency Contact Phone" size="40"/>
</fieldset>
</body>
</html>
<br/>
<html>
<body>
<form>
<fieldset>
<legend><h1>Membership Type</h1></legend>
<font face="Courier New">
<table>
<tr>
<td></td>
<td><input type="checkbox" name="$10/month membership"/>$10/month membership</td></tr>
<table>
<tr>
<td></td>
<td><input type="checkbox" name="$15/month membership"/>$15/month membership</td></tr>
<table>
<tr>
<td></td>
<td><input type="checkbox" name="$25/month membership"/>$25/month membership</td></tr>
</table>
</fieldset>
</body>
</html>
<br/>
<form>
<fieldset>
<legend><h1>Bank Information</h1></legend>
<font face="Courier New">
Cardholder Full Name: <input type="text" name="Cardholder's Name" size="60"/>
</p>
Card Number: <input type="text" name="Card Number" size="60"/>
Expiration Date: <input type="text" name="Expiration Date" size="40"/>
</p>
Security Code: <input type="text" name="Security Code" size="60"/>
</p>
Billing Address is the same as the mailing address? Yes<input type="checkbox" name="Yes"/>
No<input type="checkbox" name="No"/></p>
If not,please add your billing address:</p>
Billing Address: <input type="text" name="Billing Address" size="60"/></p>
City: <input type="text" name="Billing City" size="30"/>
State: <input type="text" name="Billing State" size="25"/>
Zip Code: <input type="text" name="Billing Zip Code" size="25"/></p>
</table>
</fieldset>
</body>
</html>
<br/>
<br/>
<input type="checkbox" name=""/>I understand and agree that checking the box above constitutes my electronic signature and is intended to have the same force and effect as a manual signature.I agree to pay each month until I cancel my membership.<br/>
<br/>
<center><input type="Submit" value="Click to Submit"/>
<input type= "reset" value="Clear Entries"/></center>
</form>
</body>
</html>
<a href="#top">Back to Top</a>
Explanation / Answer
for the above form we have to give the validations for diffenent controls like text ,textArea,checkboxes
The following declarations are the way of validations for all the controls that are existing in the form
insert this code logic into script part.
scripting for the validation of (name) textbox :
function validateform(){
var name=document.myform.name.value;
var password=document.myform.password.value;
if (name==null || name==""){
alert("Name can't be blank");
return false;
}
}
validation for (contact no) textbox:
function Validation()
{
var a = document.form.phone.value;
if(a=="")
{
alert("please Enter the Contact Number");
document.form.phone.focus();
return false;
}
if(isNaN(a))
{
alert("Enter the valid 10 digits Mobile Number");
document.form.phone.focus();
return false;
}
if((a.length < 1) || (a.length > 10))
{
alert(" Your Mobile Number must be 1 to 10 Integers");
document.form.phone.select();
return false;
}
validation for (Address) textArea
function Validation()
{
var a = document.form.address.value;
if(a=="")
{
alert("please Enter the details");
document.form.address.focus();
return false;
}
if((a.length < 20) || (a.length > 100))
{
alert(" Your textarea must be 20 to 100 characters");
document.form.address.select();
return false;
}
}
validation for (membership) checkboxes:
function ValidateForm(form){
ErrorText= "";
if ( ( form.$10/month membership[0].checked == false ) && ( form.$10/month membership"[2].checked == false ) )
{
alert ( "Please choose membership type" );
return false;
}
if (ErrorText= "") { form.submit() }
}
thank you
Related Questions
drjack9650@gmail.com
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.