4 Replies - 679 Views - Last Post: 03 May 2013 - 03:03 AM

#1 tazzy0429  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 27
  • Joined: 27-April 12

Syntax error in validation code ...line 52... what am I missing?

Posted 01 May 2013 - 12:23 PM

I keep getting a syntax error on line 52 I am sure it has something to do with my brackets. Can someone point me in the right direction. with this





1. On the page load, use a pop up box that alerts the user that the webpage is under construction and that it will be 100% complete by June 1, 2013.
2. A restaurant logo in the top left corner of the webpage. This should be simple text with style. Make it look more like a logo by changing the font style and color. If you don’t know how to do this, look at one of my templates or search the web for an example.
3. Below the logo, add an image slider of your choice. The image slider should have at least 3 images of restaurant food entrees. Your slider should not be larger than 1000px Wide x 700px High.
4. Below the image slider, include a place for the user to see the daily specials by clicking on the day of the week. Include a title that says “Click below to see our daily specials”. For example, if the user clicks on Monday, the daily special for Monday will pop up in an alert box. Of course, you are creating these specials yourself. Just include a brief description of what the special is and the price.
5. Below the form, display the following menu items:
a. 5 Entrees with descriptions, prices, and some sort of menu identifier.
b. 3 Beverages with prices and some sort of menu identifier.
c. 3 Desserts with prices and some sort of a menu identifier.

Example Entree: E1 – Quarter pound burger with lettuce, tomato, mayonnaise and cheese. Served with side of fries. ($6.50)
Example Beverages: B1 – Pepsi ($1.00), B2- Sprite ($1.00), B3-Lemonade ($2.00)
Example Desserts: D1 – Chocolate Cake ($1.00), D2- Lemon Cake ($1.00), D3-Banana Pudding ($2.00)

6. Below the menu, include a form that the user can use to place a pick-up order. A person can include up to 8 items per order, so only include 8 textboxes for them to enter their items.

The form should include:
a. First Name
b. Last Name
c. Telephone Number
d. Email Address
e. Their selections, which they type into a textbox. Give the user 8 textboxes for entry (because they can order up to 8 items):
Entrees (they enter the entrée identifier in a textbox, ie. E1, E2, E3, …)
Drinks (they enter the drink identifier in a textbox, ie. B1, B2, B3)
Desserts (they enter the dessert identifier in a textbox, ie. D1, D2)

Sample order:
Jane
Doe
336-555-4545
janedoe@hungry.com
E1 E3 B2 B3 D1
7. Validate the form so that the First Name is not blank, the Last name is not blank, the Telephone number is in correct form, the Email address is in the correct form, and the items they have selected are valid. To make it simple for now, you are not giving the person their total. Also, use alert boxes to notify the person that their entries are not correct. Do not submit the form until validation has passed. When the form does go through, redirect to a page called “ordersubmitted.html” that says “Thank you for ordering, please pick up within 15-20 minutes”.





<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Final Project Template</title>

<style>
	body{background-color:#8A0000; font-family:Arial, Helvetica, sans-serif;}
	#container{background-color:white; width:1020px; height:auto; margin:0 auto; padding:30px;}
	#imageSlider{padding:20px; width:800px; height:350px; background-color:black;}
	.dayOfWeekSpecial{border:2px solid red; font-weight:bold; font-size:18px; float:left; width:75px; text-align:center; padding:10px; margin-right:10px;}
	.title{border-bottom:2px solid red;}
	#myForm{background-color:black; color:white; padding:20px; }
	#myForm .item{width:30px; font-size:18px; float:left; margin-right:10px;}
	#submitButton{height:40px; color:white; background-color:red}
	
</style>

<script>

	

	function validateForm()
	{
var x=document.forms["myForm"]["fname"].value;
if (x==null || x=="")
  {
  alert("First name must be filled out");
  return false;
  }
	
var y=document.forms["myForm"]["lname"].value;
if (y==null || y=="")
  {
  alert("First name must be filled out");
  return false;
  }


	var z=document.forms["myForm"]["email"].value;
var atpos=z.indexOf("@");
var dotpos=zlastIndexOf(".");
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=z.length)
  {
  alert("Not a valid e-mail address");
  return false;
  }

	
	var phone = /^\(?([0-9]{3})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$/;   
  if((inputtxt.value.match(phone))   
        {   
      return true;   
        }   
     else  
       {   
        alert("Not a Valid Phone number");   
        return false;   
        }   
}  
		/*
				 INSERT ALL CODE that you need to validate the form.  First Name abd Last name should not be blank. 
				 Phone Number and Email Address should not be blank and should be in correct format.  You can use simple
				 ALERT statements to notify the customer of incorrect entry.  You DO NOT have to use onblur functions.
			*/
			
			
			
  
}   
}  

			
			
			if(checkValidOrder(document.forms['myForm']['item1'].value) == false
				|| checkValidOrder(document.forms['myForm']['item2'].value) == false
				|| checkValidOrder(document.forms['myForm']['item3'].value) == false
				|| checkValidOrder(document.forms['myForm']['item4'].value) == false
				|| checkValidOrder(document.forms['myForm']['item5'].value) == false
				|| checkValidOrder(document.forms['myForm']['item6'].value) == false
				|| checkValidOrder(document.forms['myForm']['item7'].value) == false
				|| checkValidOrder(document.forms['myForm']['item8'].value) == false
			
			)
				return false;
				
			else
				//if no errors are found, return true (form is ready)
				return true;
	}
	
	function notify() <!-- add this to the body tag as an onload action -->
	{
		alert("The web page is under construction and will be 100% complete by June 1, 2013.");
	}
	
	function showMWednesdaySpecial()
	{
		alert("Wednesday's special is Buy 2 (E2) get one FREE! ");
	}
	function showThursdaySpecial()
	{
		alert("Thursday's special is 10% off thursday with free drinks!");
	}
	function showFridaySpecial()
	{
		alert("Fridays's special is Free appitizer with order of two entrees!");
	}
	function showTuesdaySpecial()
	{
		alert("Tuesday's special is kid's eat FREE with one paying adult!");
	}
	function showMondaySpecial()
	{
		alert("Monday's special is any entree Buy 1 Get 1 Half Off!");
	}
	
	//This function gets the value for each order item (texbox value) and it checks to see if they are valid inputs
	function checkValidOrder(orderCode) 
	{
		//If first order code is empty, tell the customer that they must order at least one item
		if(document.forms['myForm']['item1'].value == null || document.forms['myForm']['item1'].value == "")
		{
			alert("You must order at least one item.");
			return false;
		}
		
		//If the order code is blank, no problem.  That means they only want one item which is in the first textbox
		else if(orderCode == null || orderCode == "") 
			return true;
		
		//Checks each valid order code. 
		else if(orderCode != 'D1' && orderCode != 'D2' && orderCode != 'D3' && orderCode != 'E1' && orderCode != 'E2' && orderCode != 'E3'&& orderCode != 'DE4' && orderCode != 'E5' && orderCode != 'B1' && orderCode != 'B2' && orderCode != 'B3' && orderCode != 'B4' && orderCode != 'B5'  ) 
		{
			alert("Please check your order. " + orderCode + " is not a valid choice.");
			return false;
		}
		
		//If there are no errors, return true (this part of form is ready)
		else
			return true;
	}	
	
</script>

</head>

<body onload="onloadFunction()">
E4
<div id="container">

	<h1 style="border-bottom: dashed black 2px; font-family:'Arial Black', Gadget, sans-serif; color:red">
		Patty's Homemade Cooking
	</h1>

    <div id="imageSlider">
 
    </div>
 
    <h2> Click on a day below to see daily specials </h2>
    <p class="dayOfWeekSpecial" onclick="showMondaySpecial()"> Monday </p>
    <p class="dayOfWeekSpecial" onclick="showTuesdaySpecial()"> Tuesday </p>
     <p class="dayOfWeekSpecial"onclick="showWednesdaySpecial()"> Wednesday </p>
     <p class="dayOfWeekSpecial" onclick="showThursdaySpecial()"> Thursday </p>
       <p class="dayOfWeekSpecial" onclick="showFridaySpecial()"> Friday </p>
    
    <div style="clear:left"> </div>
    
   <h2 class="title"> Entrees </h2>
        <h3> E1 - Quarter pound burger with lettuce, tomato, mayonnaise and cheese.  Served with side of fries. ($6.50)  </h3>
        <h3> E2 - Fried chicken breast with lettuce, tomato, and honey mustard.  Served with side of fries. ($5.50)  </h3>
        <h3> E3 - Fried buffalo chicken wings (6) with celery and your choice of Ranch or Blue Cheese.  Served with side of onion rings. ($6.00)  </h3>
         <h3> E4 - 2 Hot Dogs with your choice of mustard, ketchup, mayonaise, relish, chilli, or slaw. Served with a side of fries ($6.25)  </h3>
          <h3> E5 - Chef Salad with lettuce, tomatoe, shredded cheese, onions, pickles, ham, turkey, and cucumbers. Served with your choice of dressing: ranch, thousand island, or House Italian ($6.50)  </h3>
    
   <h2 class="title"> Beverages </h2>
   		<h3> B1 - Pepsi ($1.00) </h3>
        <h3> B2 - Dr Pepper ($1.00) </h3>
        <h3> B3 - Sprite ($1.00) </h3>
        <h3> B4 - Sweet Tea ($1.00) </h3>
        <h3> B5 - Milk ($1.00) </h3>
   	
   <h2 class="title"> Desserts </h2>
   		<h3> D1 - Apple Pie ($1.00) </h3>
        <h3> D2 - Chocolate Cake ($1.00) </h3>
        <h3> D3 - Cheese Cake ($1.00) </h3>
   
   <form name="myForm" id="myForm" onsubmit="return validateForm()" method="post" action="submitOrder.html">
   		<h2 style="color:red"> Place a Pick-up Order </h2>
        <p> *All fields are required </p>
        
        <p><label>First Name:</label> <input type="text" name="fname"> </p>
        <p><label>Last Name: </label><input type="text" name="lname"> </p>
        <p><label>Phone Number (xxx-xxx-xxxx): </label> <input type="text" name="phone"> </p>
        <p><label>Email Address (email@domain.com): </label><input type="text" name="email"> </p>
      	
        <h3> You can include up to any 8 items per order. List each desired selection below (ie. E1, E2, B1, etc.).  You will receive your total when you pick up your order.  Thank You!</h3>
        <p><input type="text" id="item1"  class="item"> </p>
        <p><input type="text" id="item2"  class="item"> </p>
        <p><input type="text" id="item3"  class="item"> </p>
        <p><input type="text" id="item4"  class="item"> </p>
        <p><input type="text" id="item5"  class="item"> </p>
        <p><input type="text" id="item6"  class="item"> </p>
        <p><input type="text" id="item7"  class="item"> </p>
        <p><input type="text" id="item8"  class="item"> </p>

    	<input type="submit" value="Submit Order" id="submitButton">
     
   </form>
   
</div>

</body>
</html>



Is This A Good Question/Topic? 0
  • +

Replies To: Syntax error in validation code ...line 52... what am I missing?

#2 andrewsw  Icon User is offline

  • Fire giant boob nipple gun!
  • member icon

Reputation: 2877
  • View blog
  • Posts: 9,548
  • Joined: 12-December 12

Re: Syntax error in validation code ...line 52... what am I missing?

Posted 01 May 2013 - 12:32 PM

you have an extra unmatched bracket on the previous line.
Was This Post Helpful? 1
  • +
  • -

#3 andrewsw  Icon User is offline

  • Fire giant boob nipple gun!
  • member icon

Reputation: 2877
  • View blog
  • Posts: 9,548
  • Joined: 12-December 12

Re: Syntax error in validation code ...line 52... what am I missing?

Posted 01 May 2013 - 01:09 PM

Having corrected this, there are other unmatched brackets further down.

It would help a great deal if you aligned your brackets neatly. Also, it is preferable in JS that the opening bracket following a function declaration appear on the same line (due in part to semi-colon insertion):

function something() {

and
function notify() <!-- add this to the body tag as an onload action -->

you are using an HTML comment within your JS.
Was This Post Helpful? 1
  • +
  • -

#4 tazzy0429  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 27
  • Joined: 27-April 12

Re: Syntax error in validation code ...line 52... what am I missing?

Posted 02 May 2013 - 07:29 AM

Thanks for the help i had looked at it all so long i was cross eyed...lol. My phone number validation doesn't seem to work. Am i missing something there . First name and ;last name work well but that doesn't. And could someone point me to a jquery tutorial on image sliders. I need one and this is not something in the book we use.



<script>

	function validateForm()
{	
var x=document.forms["myForm"]["fname"].value;
{if (x==null || x=="")
{
  alert("First name must be filled out");
  return false;
  }
	
var y=document.forms["myForm"]["lname"].value;
if (y==null || y=="")
  {
  alert("Last name must be filled out");
  return false;
  }
var phone = /^\(?([0-9]{3})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$/;   
  if(inputtxt.value.match(phone))   
        {   
      return true;   
        }   
     else  
       {   
        alert("Not a Valid Phone number");   
        return false;   
        }   
  
var z=document.forms["myForm"]["email"].value;
var atpos=z.indexOf("@");
var dotpos=zlastIndexOf(".");
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=z.length)
  {
  alert("Not a valid e-mail address");
  return false;
  }
  

}  
				
	
			
			if(checkValidOrder(document.forms['myForm']['item1'].value) == false
				|| checkValidOrder(document.forms['myForm']['item2'].value) == false
				|| checkValidOrder(document.forms['myForm']['item3'].value) == false
				|| checkValidOrder(document.forms['myForm']['item4'].value) == false
				|| checkValidOrder(document.forms['myForm']['item5'].value) == false
				|| checkValidOrder(document.forms['myForm']['item6'].value) == false
				|| checkValidOrder(document.forms['myForm']['item7'].value) == false
				|| checkValidOrder(document.forms['myForm']['item8'].value) == false
			
			)
				return false;
				
			else
				//if no errors are found, return true (form is ready)
				return true;
	}
	
	function notify()
	{
		alert("The web page is under construction and will be 100% complete by June 1, 2013.");
	}
	
	function showMWednesdaySpecial()
	{
		alert("Wednesday's special is Buy 2 (E2) get one FREE! ");
	}
	function showThursdaySpecial()
	{
		alert("Thursday's special is 10% off thursday with free drinks!");
	}
	function showFridaySpecial()
	{
		alert("Fridays's special is Free appitizer with order of two entrees!");
	}
	function showTuesdaySpecial()
	{
		alert("Tuesday's special is kid's eat FREE with one paying adult!");
	}
	function showMondaySpecial()
	{
		alert("Monday's special is any entree Buy 1 Get 1 Half Off!");
	}
	
	//This function gets the value for each order item (texbox value) and it checks to see if they are valid inputs
	function checkValidOrder(orderCode) 
	{
		//If first order code is empty, tell the customer that they must order at least one item
		if(document.forms['myForm']['item1'].value == null || document.forms['myForm']['item1'].value == "")
		{
			alert("You must order at least one item.");
			return false;
		}
		
		//If the order code is blank, no problem.  That means they only want one item which is in the first textbox
		else if(orderCode == null || orderCode == "") 
			return true;
		
		//Checks each valid order code. 
		else if(orderCode != 'D1' && orderCode != 'D2' && orderCode != 'D3' && orderCode != 'E1' && orderCode != 'E2' && orderCode != 'E3'&& orderCode != 'DE4' && orderCode != 'E5' && orderCode != 'B1' && orderCode != 'B2' && orderCode != 'B3' && orderCode != 'B4' && orderCode != 'B5'  ) 
		{
			alert("Please check your order. " + orderCode + " is not a valid choice.");
			return false;
		}
		
		//If there are no errors, return true (this part of form is ready)
		else
			return true;
	}	
	
</script>

Was This Post Helpful? 0
  • +
  • -

#5 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3391
  • View blog
  • Posts: 9,586
  • Joined: 08-June 10

Re: Syntax error in validation code ...line 52... what am I missing?

Posted 03 May 2013 - 03:03 AM

I see 2 issues:
- a form’s value is never null. besides that, (null == "") // true
- you rely on inputtext being globally defined, which may or may not be the case (if it’s not, it would show up in the Error Console)

and some tip: on line #101 you have an awful lot of comparisons. that can be simplified:
var validOrderCodes = ['D1', 'D2', 'D3', 'E1', 'E2', 'E3', 'DE4', 'E5', 'B1', 'B2', 'B3', 'B4', 'B5'];
if (validOrderCode.indexOf(oderCode) === -1) {
  // not a valid order code
}


This post has been edited by Dormilich: 03 May 2013 - 03:03 AM

Was This Post Helpful? 0
  • +
  • -

Page 1 of 1