Hey guys, how's it going? Sorry if this has been posted before but I can't seem to find a solution to my problem at all. I am attempting JavaScript for the first time and have come to "point blank" where I just can't see where I'm going wrong.
To begin with, I am using a script from Apple in order to have a base guide Apple Script.
My XHTML source code can be seen below. Where I'm going wrong I have no idea, but upon hitting the submit button with none of the fields filled in with any data whatsoever, or any of the checkboxes/radio buttons selected, it doesn't give me a single error or anything. It just looks as if the browser reloads the page and brings me back again to the top.
If someone could help me by guiding me on where I'm going wrong I would greatly appreciate it. The script from Apple won't be used, obviously as my fields and options are mostly different, but I was hoping features such as the email/phone functions would work for me to have a base to work from.
HTML Code:
<!-- The Booking Form -->
<h1>Ski School Booking Form</h1>
<!-- Start Booking Form Here -->
Please complete the form below. Fields marked with a <em>*</em> are mandatory.<br /><br />
<form method="post" action="booking.html" class="booking" onsubmit="javascript:return checkWholeForm(this)">
<!-- Customer Details Section -->
<fieldset>
<legend>Customer Details</legend>
<ol>
<li>
<label for="name">Name: <em>*</em></label>
<input type="text" id="name" />
</li>
<li>
<label for="address">Address: <em>*</em></label>
<input type="text" id="address" />
</li>
<li>
<label for="phone">Phone: <em>*</em></label>
<input type="text" id="phone" />
</li>
<li>
<label for="email">E-Mail: <em>*</em></label>
<input type="text" id="email" name="email" />
</li>
</ol>
</fieldset>
<fieldset>
<legend>Booking Information</legend>
<ol>
<li>
<label for="level">Level <em>*</em></label>
<select id="level">
<option value="beginner">Beginner</option>
<option value="intermediate">Intermediate</option>
<option value="advanced">Advanced</option>
</select>
</li>
<li>
<label for="lessontype">Lesson Type <em>*</em></label>
<select id="lessontype">
<option value="individual">Individual</option>
<option value="group">Group</option>
</select>
</li>
<li>
<fieldset>
<legend>Do you wish to ski or snowboard? <em>*</em></legend>
<label><input type="radio" name="sport-type" id="ski" value="ski" />Ski</label>
<label><input type="radio" name="sport-type" id="snowboard" value="snowboard" />Snowboard</label>
</fieldset>
</li>
<li>
<label for="lessondays">Lesson Days <em>*</em></label>
<select id="lessondays">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
</select>
</li>
<li>
<label for="language">Language Spoken <em>*</em></label>
<select id="language" name="language">
<option value="english">English</option>
<option value="french">French</option>
<option value="spanish">Spanish</option>
<option value="chinese">Chinese</option>
<option value="japanese">Japanese</option>
</select>
</li>
<li>
<fieldset>
<legend>Which of the following equipment do you need for hire?</legend>
<label for="carver-beginner"><input id="carver-beginner" type="checkbox" value="carver-beginner" name="equipment" /> Carver (Beginner)</label>
<label for="carver-advanced"><input id="carver-advanced" type="checkbox" value="carver-advanced" name="equipment" /> Carver (Advanced)</label>
<label for="skis"><input id="skis" type="checkbox" value="skis" name="equipment" /> Skis</label>
<label for="snowboard"><input id="snowboard" type="checkbox" value="snowboard" name="equipment" /> Snowboard</label>
<label for="boots"><input id="boots" type="checkbox" value="boots" name="equipment" /> Boots</label>
<label for="poles"><input id="poles" type="checkbox" value="poles" name="equipment" /> Poles</label>
</fieldset>
</li>
<li>
<label for="hire-days">Number of days hire</label>
<select id="hire-days" name="hire-days">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
</select>
</li>
<li>
<fieldset>
<legend>Ski Pass included? <em>*</em></legend>
<label><input type="radio" name="ski-pass" id="yes" value="yes" />Yes</label>
<label><input type="radio" name="ski-pass" id="no" value="no" />No</label>
</fieldset>
</li>
</ol>
</fieldset>
<p><input type="submit" name="submit" value="Submit Booking" />
<input type="reset" name="reset" value="Reset" /></p>
</form>
<!-- End Booking Form Here -->
I think if anything, this is where I'm going wrong;
Code:
onsubmit="javascript:return checkWholeForm(this)"
because anything after this is all highlighted in green on my editor. In other words, the syntax highlighting disappears.
Many thanks in advance.
Last edited by Resilient : 04-23-2008 at 08:49 PM.
|