...

View Full Version : help with javascript/html forms



tombo1988
12-08-2010, 03:59 AM
hey guys, just wondering if u could help me out i'm writing a form for ordering pizza and i'm using a button to submit the info with an onclick event handler.
for some reason it won't call the function that i want it to when the submit button is click. here is the code any idea what i'm doing wrong????


<html>
<body>

<form name="form1" action="popup" method="get">
<fieldset>
<legend>Pizza Order form</legend>
<p>Write in a First name</P>

<input type="text" size="20" maxlength="50" name="firstName"></p>
<p>Write in a last name (or surname):<br>

<input type="text" size="20" maxlength="50" name="surName"></p>
<p>Write in an email address:<br>

<input type="text" size ="20" maxlegth="50 name="address">
<p>Are you a previous customer?:<br>
<select name="precust">
<option selected>- - - - - - Select one - - - - - -</option>

<option value="Yes">Yes</option>
<option value="No">No</option>

</select></p>

<p>pickup or delivery:<br>
<select name="delivery">
<option selected>- - - - - - Select one - - - - - -</option>

<option value="pickup">pickup</option>
<option value="dilivery">delivery</option>

</select></p>

<p>size:<br>
<select name="size">
<option selected>- - - - - - Select one - - - - - -</option>

<option value="small">small</option>
<option value="medium">medium</option>
<option value="large">large</option>
<option value="XL">extra large</option>

</select></p>

<p>number of pizzas:<br>
<select name="num">
<option selected>- - - - - - Select one - - - - - -</option>

<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>
<option value="8">8</option>
<option value="9">9</option>

<option value="10">10</option>

</select></p>

<p>Toppings:<br>
Bacon <input type="checkbox" name="bacon" value="bacon"><br>

extra cheese <input type="checkbox" name="xcheese" value="extra cheese"><br>

olives<input type="checkbox" name="olives" value="olives"><br>

pepperoni<input type="checkbox" name="pepperoni" value="pepperoni"><br>

mushrooms<input type="checkbox" name="mushrooms" value="mushrooms"><br>

green pepper<input type="checkbox" name="gpepper" value="green pepper"><br>

red pepper<input type="checkbox" name="rpepper" value="redpepper"><br>

sausage <input type="checkbox" name="sausage" value="sausage"><br>

ham<input type="checkbox" name="ham" value="ham"><br>

pineapple<input type="checkbox" name="pineapple" value="pineapple"><br><br>

<input type=button name="hawaiian" value="hawaiian" onclick='
document.form1.ham.checked = true;
document.form1.mushrooms.checked = true;
document.form1.pineapple.checked = true;
document.form1.bacon.checked = false;
document.form1.gpepper.checked = false;
document.form1.rpepper.checked = false;
document.form1.olives.checked = false;
document.form1.pepperoni.checked = false;
document.form1.sausage.checked = false;
document.form1.xchees.checked = false;
'>

<input type=button name="meatlovers" value="meatlovers" onclick='
document.form1.ham.checked = false;
document.form1.mushrooms.checked = false;
document.form1.pineapple.checked = true;
document.form1.bacon.checked = false;
document.form1.gpepper.checked = true;
document.form1.rpepper.checked = true;
document.form1.olives.checked = true;
document.form1.pepperoni.checked = false;
document.form1.sausage.checked = false;
document.form1.xcheese.checked = false;
'>
<input type=button name="vegetarian" value="vegetarian" onclick='
document.form1.ham.checked = true;
document.form1.mushrooms.checked = false;
document.form1.pineapple.checked = false;
document.form1.bacon.checked = true;
document.form1.gpepper.checked = false;
document.form1.rpepper.checked = false;
document.form1.olives = "unchecked"
document.form1.pepperoni.checked = true;
document.form1.sausage.checked = true;
document.form1.xcheese.checked = false'>




<p><input type=button name="submit" value="Submit" onclick='submit()'></p>
</fieldset>
</form>


<script type="text/javascript" language="Javascript" >

function submit()
{
var fname = document.form1.firstname.value;
var lname = document.form1.surname.value;
var address = document.form1.address.value;
var size = document.form1.size.value;
var num = document.form1.num.value;
var delivery = document.form1.delivery.value;
var precust = document.form1.precust.value;

var price;
var message;

if(document.form1.size.value == "small"){price=5}
if(document.form1.size.value == "medium"){price=8}
if(document.form1.size.value == "large"){price=10}
if(document.form1.size.value == "XL"){price=13}

price = price * num;

if(document.form1.precust.value == "yes"){price=price*0.9}

if(document.form1.delivery.value == "delivery"){price=price+4}


message = "Thank you " + fname + " " + lname;

message += "You ordered " + document.form1.num.value + " " + document.form1.size.value + " pizzas. ";


message += "Your total price is $" + price;

var r=confirm(message);// displays the message in a pop-up

return(1);

}
</script>

</html>

Philip M
12-08-2010, 10:00 AM
submit is a reserved word - you may not have a function named submit().
You should use your error console to identify quite a few spelling/capitalisation errors, e.g:-
document.form1.xchees.checked = false;
var fname = document.form1.firstname.value;
var lname = document.form1.surname.value;

Javascript is case sensitive so firstname != firstName.

document.form1.olives = "unchecked"

You seem to have got your meatlovers and vegetarians transposed! :eek:

BTW, when posting here please follow the posting guidelines and wrap your code in CODE tags. This means use the octothorpe or # button on the toolbar. You can (and should) edit your previous post.


“A man ceases to be a beginner in any given science and becomes a master in that science when he has learned that he is going to be a beginner all his life.” - Robin G. Collingwood (English Philosopher, 1889-1943)

tombo1988
12-08-2010, 03:05 PM
thanks very much!! I was beginning to suspect that submit might be a keyword or something. also i was fixing all the spelling/capitlisation stuff while i waited for a response.

in the future i will make sure to wrap my code in tags. thanks again for the tips, you've helped me out alot!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum