Javascript functions not loading / working

Question

I'm very new to javascript, so finding it hard to see where I went wrong. For some reason my functions aern't working. Any help would be appreciated. I've tried using them in an external js file, head / body and nothing seems to work. The mistake is either with the functions or with calling them.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  

<html xmlns="http://www.w3.org/1999/xhtml">

<head>  
<title>Nicky's</title> 
 <meta http-equiv="content-type" 
    content="text/html; charset=iso-8859-1" /> 
<link href="style.css" rel="stylesheet" type="text/css"/>

<script type="text/javascript">

function CheckfName() {
 var name=0;
 var checknames=isNaN(name);

 window.alert("Please use only letters in the name space");
return false; }

function checkc number() {
 var cellN=0;
 var numBercheck=isNan(cellN);

 window.alert("Please use only numbers in the cell number space");
return false }

function confirmBooking() {
 if(document.forms[0].firstName.value==0
   || document.forms[0].lastName.value.value==0) {

 window.alert("Please fill in your First and Last name"); 
return false; }

 if(document.forms[0].firstName.value==""
   || document.forms[0].lastName.value=="") {

 window.alert("Please fill in your  first and last name");
return false; }

else if(document.forms[0].areaCode.value==""
   || document.forms[0].threeMiddlenumbers.value==""
   || document.forms[0].LastfourNumbers.value=="") {

 window.alert("Please enter your cell number.");
return false; }

else if(document.forms[0].hairstyles.value=="Setdefault"
   || document.forms[0]servCes.value=="Setdefault") {

 window.alert("Please select hairstyle type");
return false; } 

else if(document.forms[0].day.value=="SelectDay"
   || document.forms[0].month.value=="SelectMonth" 
   || document.forms[0].time.value=="Selectime") {

 window.alert("Please select the Day, Month and Time!");
return false; }}


function resetBooking() {
 var reset=window.confirm("Are you sure that you want to reset 
                            your booking information?");

 if(reset==true) {
return true;
return false; }}

</script>

</head>

<body>

 <div class="wrapper">
   <div id="header">

   </div>    

<ul id="navlist">
<li><a href="Home.html">Home</a></li>
<li><a href="BookingOrOrder.html">Booking</a></li>
<li><a href="Services.html">Services</a></li>
<li><a href="ContactUs.html">Contact Us</a></li>
</ul> 

  <div id="article">

<form method="get" action="BookingProcessor.html" enctype="application/x-www-form-urlencoded"
  onsubmit="return confirmBooking();" onreset="return resetBooking();">

<p>First Name
 <input type="text" onchange="CheckfName()" name="firstName" maxlength="35" size="35"
   style="margin-left:20px;"/> 
</p>

<p>Last Name
 <input type="text" onchange="CheckfName()" name="lastName" maxlength="35" size="35"
   style="margin-left:28px;"/>
</p>

<p>Cell Number
 <input type="text" onchange="CheckCnumber()" name="areaCode" size="3" maxlength="3"
   style="margin-left:15px;">
 <input type="text" name="threeMiddleNumbers" size="3" onchange="CheckCnumber()" 
   maxlength="3"/> 
 <input type="text" name="LastfourNumbers" size="4" onchange="CheckCnumber()" 
   maxlength="4"/>

<p>Hairstyle Type
 <select name="hairstyles">

<option value="Setdefault">Select Hairstyle</option>
<option value="none">None</option>
<option value="straightBack">Straight back long</option>
<option value="Bondings">Bondings</option>
<option value="hairByhair">Hair by hair</option>
<option value="blowNcut">Blow and Cut</option>
<option value="bopCorn">Bopcorn</option>
<option value="twistLong">Twist Long</option>
<option value="dreadS">Dreads</option>

 </select
 </p>

<select name="day">

<option value="SelectDay">Select Day</option>
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>

</select>

<select name="month">

<option value="SelectMonth">Select Month</option>
<option value="January">January</option>
<option value="February">February</option>
<option value="March">March</option>
<option value="April">April</option>
<option value="May">May</option>
<option value="June">June</option>
<option value="July">July</option>
<option value="August">August</option>
<option value="September">September</option>
<option value="October">October</option>
<option value="November">November</option>
<option value="December">December</option>

</select>

<select name="time">

<option value="Selecttime">Select Booking Time</option>
<option value="8to9">Between 8am and 9am</option>
<option value="9to10">Between 9am and 10am</option>
<option value="10to11">Between 10am and 11am</option>
<option value="11to12">Between 11am and 12pm</option>
<option value="12to13">Between 12pm and 13pm</option>
<option value="13to14">Between 13pm and 14pm</option>
<option value="14to15">Between 14pm and 15pm</option>
<option value="15to16">Between 15pm and 16pm</option>
<option value="16to17">Between 16pm and 17pm</option>
<option value="17to18">Between 17pm and 18pm</option>

</select>

<p>If there are any other requirements, please specify in the text area below</p>

<p>
 <textarea name="Requirement" cols="40" rows="3" style="overflow: hidden;">
 </textarea> 
</p>

<p>

<input type="submit" value="Place a Book">
<input type="reset" value="Reset a Form">

    </form>

  </div>

 </div>

</body>

</html>

You have errors in your javascript. Paste it here: jslint.com — Dylan
– Dylan, Commented May 30, 2014 at 22:14
Browsers these days have built in javascript debuggers and report pretty well on errors in syntax. Try hitting F12 in your browser. — Pete Scott
– Pete Scott, Commented May 30, 2014 at 22:22

OutFall · Accepted Answer · 2014-05-30 22:18:04Z

1

Here are some issues I've found.

function checkNumber() {
 var cellN=0;
 var numBercheck=isNan(cellN);

 window.alert("Please use only numbers in the cell number space");
 return false;
}

use checkNumber instead of "checkc number", also no semicolon after return statement

function resetBooking() {
 var reset=window.confirm("Are you sure that you want to reset your booking information?");

 if(reset==true) {
  return true;
 }
 return false;
}

if statement is wrong (it had 2 returns )

answered May 30, 2014 at 22:18

OutFall

4827 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Pete Scott Over a year ago

Also, missing a period here: "|| document.forms[0]servCes.value=="Setdefault") {" between [0] and servCes

Pete Scott Over a year ago

And you can't break strings into multiple lines with escaping the carriage return with a "\" (on this one: var reset=window.confirm("Are you sure that you want to reset )... after that and the above fixes, it seems to run fine.

Zabed Akbar · Accepted Answer · 2014-05-30 22:19:34Z

0

You have a typo in your function name. There should be no space.

function checkc number() {
 var cellN=0;
 var numBercheck=isNan(cellN);

 window.alert("Please use only numbers in the cell number space");
return false }

Change the name to function checkcnumber(). Also you are missing semicolon in return statement.

answered May 30, 2014 at 22:19

Zabed Akbar

5371 gold badge8 silver badges20 bronze badges

Collectives™ on Stack Overflow

Javascript functions not loading / working

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related