|
JavaScript - Direct To Webpage Depending On Combobox Selection When Submit Button Clicked
Hi
I'm new to javascript, so this is probably very simple. I've created a form with combobox with different values (this is for my website). What I want is when the user clicks 'submit' that it goes to a different page on the website depending on the value the person has selected in the combobox. Values are numerical, for example 1000, 2000, 5000 etc. I've been trying this for a couple of days now without success! Thanks in advance Similar TutorialsHi Within a classic asp webform (using vbscript) I would like part of the form (input boxes within table structure) to be specific/displayed depending on the users selection from the combo box in the row above. I think the best solution would be using Javascript can anyone suggest a solution or example code? Many thanks Sarah Dear Javascript programmers, Do you have an example of a Javascript something like this: A dropdownlist with values "one" and "two". The radio button is not visible (as a start). - If you have selected "one" from the dropdown list, then a radio button will appear. - If you have selected "two" from the dropdown list, then a radio button will NOT appear. Thanks, Cornelis Gouda - The Netherlands I have 3 check boxes and one submit button when the submit button is hit I need it to direct to one of 3 pages depending on which check box is checked. can anyone help with this Thanks! Hi everyone, Let's say i have a form that looks like this: <form name="myForm" action="myPage" onsubmit="return validateForm();"> <input type="text" name="myInput" size="10"> <input type="submit" name="add" value="Add this"> <input type="submit" name="cancel" value="Cancel this"> </form> What i'm trying to do is for the validateForm() function to either redirect the page if "Cancel this" is clicked, or continue processing if "Add this" was clicked. So the validateForm() would work something like this: function validateForm() { if (cancel button is clicked){ location.href=go some place } else{ do some other stuff } } So, how can dynamically detect which submit button was clicked, before submitting the form? (that would fill in the "cancel button is clicked") I tried with document.myForm.cancel.selected and other variations but it always returns undefined. Any input will be greatly appreciated. Thanks! How can I hide/disable the submit button if the name Todd is selected? Code: <html> <head> </head> <body> <form name="people"> <select name="group"> <option value="Pick Your Name">Choose</option> <option value="Tom">Tom</option> <option value="Freddy">Freddy</option> <option value="Todd">Todd</option> <option value="Fred">Fred</option> <option value="William">William</option> <option value="Johnson">Johnson</option> </select> <INPUT TYPE=submit VALUE="submit"> </form> </body> </html> Hello Folks, Here is my dropdown menu: Code: <select name="peeps"> <option value="Frank Tompson">Frank Tompson</option> <option value="Henry Wilson">Henry Wilson</option> <option value="Bill Kent">Bill Kent</option> <option value="Jessi McDonald"> Jessi McDonald</option> <option value="John Hays">John Hays</option> How can i make it so if i click on John Hays a JavaScript pop up will say Hello John Hays, and if i click on Bill Kent a popup will say hello Bill Kent and if i click on any other name nothing happens? Hello folks, I want to have a combobox with bookmark options. After you select a value from this combobox you can bookmark it with a push button. This should popup a bookmark dialog from the browser bookmark dialog. Can anybody help me? Lets say we have 3 options in the value's. Google, Yahoo, Bing When you select Google and you push Place bookmark you should get a browser bookmark dialog with a title "Google search site". The url would be just http://www.google.com/ I also want Yahoo with the url http://www.yahoo.com/ and the bookmark title Search at Yahoo! and Bing with the url http://www.bing.com and the title Search at Bing I'm looking already for a while for this. Can anybody help me? Thanks in advance! grid Hello. The code below lets a user select a drop down option and a picture changes depending on the selection. I am trying to make it so when you select an option on the dropdown the picture shows up in the center of the screen and in the background behind the text. Here is the code. Code: <html>
<head>
<style type='text/css'>
#txt {background-repeat:no-repeat;width:200px;height:200px;}
</style>
<script type='text/javascript'>
function div_bg(team){
document.getElementById('txt').style.backgroundImage="url(images/" + team + ".jpg)";
}
</script>
</head>
<body>
<select name='team' onChange='div_bg(this.value);'>
<option name='arsenal' value='arsenal'>Arsenal</option>
<option name='liverpool' value='liverpool'>Liverpool</option>
</select>
<div id='txt'></div>
</body>
Thanks in advance!! Hi coders, I need to achieve two things upon making a selection from a drop down field: 1) Changing the background picture of a cell. 2) Changing the size of a uploaded foreground picture within the same cell. Code: <select name=ADDITIONALINFO> <option value="25 x 25">25 x 25</option> <option value="35 x 35">35 x 35</option> <option value="45 x 45">45 x 45</option> <option value="55 x 55">55 x 55</option> </select> Any guidance how to achieve this is appreciated. <html> <script language="javascript"> function foo() { var mainDiv = document.getElementById("my"); var div = document.createElement("div"); for(j=0;j<5;j++) { var select = document.createElement("select"); for(i=0;i<5;i++) { var option = document.createElement("option"); option.text = "hmm"; select.appendChild(option); } div.appendChild(select); } mainDiv.appendChild(div); } </script> <body> <select onchange="foo()"> <option>a</option> <option>b</option> <option>c</option> <option>d</option> <option>e</option> <option selected>-----Select------</option> </select> <div id="my"></div> </body> </html> I stuck ... but I got the solution now I want to reset on every selection ? On my site's shopping cart, when clicking the "buy" button, it merely animates a little item that shows that something is now in the customer's cart. I'd like it to do this, and then redirect to "/cart", cutting down the work of what the user actually has to do (we only have one product). Here's what I'm working with: <!-- START ADD TO CART --> {% if featuredproduct.available %} <span class="featured-product price"><span>{{ featuredproduct.price | money }}</span>{% if featuredproduct.compare_at_price_max > featuredproduct.price %} <del>{{ featuredproduct.compare_at_price | money }}</del>{% endif %}</span> <input type="submit" value="{{ settings.text_addtocart }}" class=" add-to-cart addtocart button primary"> {% else %} <h3 class="featured-product price sold-out"><span>Sold Out</span></h3> <input type="submit" value="{{ settings.text_addtocart }}" class="featured-product add-to-cart button primary disabled" disabled="disabled "> {% endif %} <!-- END ADD TO CART --> Adding an "onclick="location.href='/cart';" after the input classes does not fire the actual act of adding the item to the cart, so it shows an empty cart on the redirect. JS newbie, sorry for the rough explanation. Any help greatly appreciated! How can I make this code disable the submit button once it has been pressed, then if the user hits back or GOES back, it will re-enable it again? Code: <SCRIPT LANGUAGE="JavaScript" TYPE="text/JavaScript">
function formControl(submitted)
{
if(submitted=="1")
{
commentForm.Submit.disabled=true
alert("Thanks for your comments!")
}
}
</SCRIPT>
Thanks! ShadowIce~ Hello I've been struggling trying to get a small order form to work the way I want it to. Here is a link to the live page: http://www.watphotos.com/introductio...otography.html And here is the code in question: Code: <script src="js/jquery-1.4.2.min.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
var initial = 0
var total = 0;
var services = 0;
function addServices()
{
initial = 150
total = initial
services = 0;
$("input:checked").each(function(){
value = $(this).attr("value");
services += parseInt(value);
});
}
$(function()
{
addServices();
total += services;
$("form").before('<p class="price"></p>')
$("p.price").text("Total Price: US$" + total);
});
$("input:radio, input:checkbox").click(function () {
addServices();
total += services
$("p.price").text("Total Price: US$" + total);
});
});
</script>
I have two questions... Question 1 How can I make this piece of script act a little smarter. Look at the order form, I'm catering for up to 4 people and providing lunch for them. If they select 3 people and the spaghetti bol for lunch, it's only adding $10 where it should be adding $30. Obviously this is simple multiplication but since the values in my form are prices it makes it a little tricky. I'm guessing an onselect on the first part of the form which changes the pricing of the other items would be the way to go, but how do I do this? Question 2 The "Total Price" is placed before the <form> tag by the script. This is ok but it's not where I want it. How can I position this text elsewhere in the document? Thanks in advance! I want to show the div when a button is clicked. And the div will enter the page by sliding in (from the left of the page). When it got clicked again, the div will dissapear by sliding out from the page. Any suggestions? Thank You. I'm still a relative noob and i'm wondering if anyone can help. items use a structured form, so any item in that category will display on the same form when selected i want to have the save button run its normal save on all items except 1 specific item - on the 1 item i want to have it function as a save as copy (while still having "save" as its visible text), the current code set in a drop down list is $options[] = array( 'text' => 'JSAVE', 'task' => $this->getName() . '.save'); $options[] = array( 'text' => 'Save as new project', 'task' => $this->getName() . '.save2copy', 'options' => array('access' => ($this->item->id > 0))); can anyone offer any suggestions? really stuck on this one Hello everyone Background I have an electronics site on which I have a code generator. Im an stuck on how to acheive something. I will simplify what I want to do, so I can then adapt it to my code. I have a paragraph of text on the web page, on which I want to change some words with in the paragraph depending on 2 radio buttons. Example (radio buttons & short paragraph): (Radio Button) Apples (checked) (Radio Button) Bananas "Welcome to jakes fruit shop. You have selected apples today" (apples being the word that would change if the banana radio button is checked) Here is the code generator if your interested. http://www.jakeselectronics.net/conf...erator877A.php What I actually want to do is put other 'fixed' text in the input text area (near botton of page) with only the config line changing. And If I can be shown how to do the short example above, i think I will be able to edit my generator and get it to do what i want it to do. I have three divs, Step 1, Step 2, Step 3. I'm trying to get it so when a person clicks the Facebook Like, the style changes to none and Step 2 is revealed and when the Facebook Share is clicked, the Step 3 is revealed. But when I like the first thing, it doesn't change to Step 2. Any thoughts? Code: <div id="Step1"><table border="0" width="630" height="174" background="images/step1-2.jpg"><tr><td valign="top" align="left" style="padding-left: 215px; padding-top: 80px"><br />
<iframe src="http://www.facebook.com/plugins/like.php?href=LINKHERE&layout=standard&show_faces=false&width=450&action=like&font=arial&colorscheme=light&height=35" scrolling="no" action="like" frameborder="0" style="border:none; overflow:hidden; width:450px; height:35px;" allowTransparency="true"></iframe>
<br />
</tr></td></table></div><div id="Step2" ><table border="0" style="display: none" width="630" height="174" background="images/step2-2.jpg"><tr><td valign="top" align="left" style="padding-left: 210px; padding-top: 82px"><br />
<a name="fb_share" type="button" share_url="LINKHERE"></a>
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share"
type="text/javascript">
</script>
<br />
</tr></td></table></div><div id="Step3" style="display: none"><table border="0" width="630" height="174" background="images/step3-2.jpg"><tr><td valign="top" align="left" style="padding-left: 210px; padding-top: 72px"><br />
<center><a href="LINKHERE">Download Here</a>
</center></tr></td></table></div><br />
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({appId: 'ID HERE', status: true, cookie: true, xfbml: true});
FB.Event.subscribe('edge.create', function() {
document.getElementById('Step1').style.display = 'none';
document.getElementById('Step2').style.display = 'block';
document.getElementById('Step3').style.display = 'none';
setTimeout('document.getElementById(\'Step1\').style.display = \'none\';document.getElementById(\'Step2\').style.display = \'none\';document.getElementById(\'Step3\').style.display = \'block\';', 7000);
});
};
(function() {
var e = document.createElement("script");
e.type = 'text/javascript';
e.src = document.location.protocol + "//connect.facebook.net/en_US/all.js";
e.async = true;
document.getElementById("fb-root").appendChild(e);
}());
</script>
I have 4 rows in a table. Each row consist of 4 radio buttons. Each radio button per row has different values in it but has the same name (group) ex: <input type="radio" name="a" value="1"> <input type="radio" name="a" value="2"> <input type="radio" name="a" value="3"> <input type="radio" name="a" value="4"> <input type="radio" name="b" value="1"> <input type="radio" name="b" value="2"> <input type="radio" name="b" value="3"> <input type="radio" name="b" value="4"> and so on.. If I click radio button A with value 2, I want to output the total at the bottom as "2".. Also, if I click radio button B with value 3, I want to output the total of A and B as 5 and so on.. How can I automatically calculate the answer based on which radio button was click? update: I got my answer from this site: http://stackoverflow.com/questions/1...s-using-jquery I have created some online software which uses form data to submit to another page. The problem is that I have other submit buttons in the same form which submit to different pages (depending on which button is pressed). The first submit button works fine but all the others only work once. Code: <input class="cssbutton" type='submit' value='Button1' onclick="wbform.action='page1.php'; target='mainFrame'; return true;"> <input class="cssbutton" type='submit' value='Button2' onclick="wbform.action='page2.php'; target='_blank'; return true;"> <input class="cssbutton" type='submit' value='Button3' onclick="wbform.action='page3.php'; target='topFrame'; return true;"> <input class="cssbutton" type='submit' value='Button4' onclick="wbform.action='page4.php'; target='topFrame'; return true;"> <input class="cssbutton" type='submit' value='Button5' onclick="wbform.action='page5.php'; target='_blank'; return true;"> <input class="cssbutton" type='submit' value='Button6' onclick="wbform.action='page6.php'; target='_blank'; return true;"> Any ideas my friends? So I have a new window document write which outputs all my data after validation into a new window, I have tried to write a button which will (when clicked) send that information to an email address. here is my code so far. i spent about 2 hours checking and playing around looking for errors couldnt find any. I think the problem is the function EmailForm and function subwrite. Is a button written into a new window a common thing to do? or is there another simpler way, however i want the user to be able to check to see if there data is valid and then click to send the email. Code: <HTML>
<!--learn to program through JavaScript-->
<mymerch.HTML>
<HEAD>
<TITLE> mymerch </TITLE>
<SCRIPT LANGUAGE=JavaScript>
//declaringvariables
var firname;
var surname;
var phonenumber;
var emailaddress;
var streetnamenumber;
var yoursuburb;
var postcode;
var yourstate;
var product1;
var product2;
var product3;
var product4;
var product5;
var product6;
var product7;
var product8;
var totalc;
var paymethods;
var method;
var value;
var Cost;
var numericExpression;
var alphaExpression;
var sendemail;
var subject;
var message;
var mailto_link;
var win;
function main() {
//open function main
//function main which validates all data
//declaring variables
firname = document.merch.firstname.value;
surname = document.merch.lastname.value;
phonenumber = document.merch.phonenum.value;
emailaddress = document.merch.emailadd.value;
streetnamenumber = document.merch.stnamenum.value;
yoursuburb = document.merch.suburb.value;
postcode = document.merch.pcode.value;
yourstate = document.merch.state.value;
if (firname == "")
{
alert("Please fill in your Firstname.")
document.merch.firstname.value.focus()
return true;
}
//checks to see if no data as been entered and alerts the user if so.
alphaExpression = /[a-zA-z]/;
if(document.merch.firstname.value.match(alphaExpression)){
}else{
alert("You can only enter letters in the firstname field")
document.merch.firstname.value.focus()
return false;
}
//checks to see if the data entered is letter and if not true returns false.
if (surname == "")
{
alert("Please fill in your Surname.")
document.merch.lastname.value.focus()
return false
}
//checks to see if no data as been entered and alerts the user if so.
alphaExpression = /[a-zA-z]/;
if(document.merch.lastname.value.match(alphaExpression)){
}else{
alert("You can only enter letters in the lastname field")
document.merch.lastname.value.focus()
return false;
}
//checks to see if the data entered is letter and if not true returns false.
numericExpression = /^[0-9+\ ]+$/;
if(document.merch.phonenum.value.match(numericExpression)){
}else{
alert("You can only enter numbers in the Phonenumber field")
document.merch.phonenum.value.focus()
return false;
}
//checks to see if the data entered is a number and if not true returns false.
if(document.merch.phonenum.value.length <7)
{
alert("The Phone Number you have entered is not valid it contains less than 7 digits.")
document.merch.phonenum.focus()
return false
}
//checks to see if the phone number is less than 7 and if so returns false.
if(document.merch.phonenum.value.length >10)
{
alert("The Phone Number you have entered is not valid it contains more than 10 digits.")
document.merch.phonenum.focus()
return false
}
//If phone number is more than 10 return false
if (emailaddress == "")
{
alert("Sorry, your email address is not valid. You didn't enter anything.");
document.merch.emailadd.focus()
return false
}
//checks to see if no data as been entered and alerts the user if so.
if (emailaddress.indexOf("@")==-1)
{
alert("Sorry, your email address is not valid. It doesn't have an @ symbol");
document.merch.emailadd.focus()
return false
}
//checks to see if the data has an "@" and alerts the user if false.
if (emailaddress.indexOf(".")==-1)
{
alert("Sorry, your email address is not valid. It doesn't have .COM");
document.merch.emailadd.focus()
return false
}
//checks to see if the data has an dot and alerts the user if false.
if (emailaddress.indexOf(" ")!=-1)
{
alert("Sorry, your email address is not valid. It has a space!");
document.merch.emailadd.focus()
return false
}
//checks to see if the data has an space and alerts the user if false.
if (streetnamenumber == "")
{
alert("Please fill in your Street Name and Number.")
document.merch.stnamenum.value.focus()
return false
}
//checks to see if the data is empty and alerts the user if true.
if (document.merch.suburb.value == "")
{
alert("Please fill in your Suburb.")
document.merch.suburb.value.focus()
return false
}
//checks to see if the data is empty and alerts the user if true.
alphaExpression = /[a-zA-z]/;
if(document.merch.suburb.value.match(alphaExpression)){
}else{
alert("You can only enter letters in the Suburb field")
document.merch.suburb.value.focus()
return false;
}
//checks to see if the data entered is a letter and if not true returns false.
if(document.merch.pcode.value.length <3)
{
alert("The postcode you have entered is not valid.")
document.merch.pcode.value.focus()
return false
}
//checks to see if the data has less than 3 characters and alerts the user if true.
numericExpression = /^[0-9+\ ]+$/;
if(document.merch.pcode.value.match(numericExpression)){
}else{
alert("You can only enter numbers in the postcode field")
document.merch.pcode.value.focus()
return false;
}
//checks to see if the data entered is a number and if not true returns false.
if(document.merch.pcode.value.indexOf(" ")!=-1)
{
alert("The postcode you have entered is not valid.")
document.merch.pcode.value.focus()
return false
}
//checks to see if the data has a space and alerts the user if true.
if (document.merch.state.value == "Select")
{
alert("Please select your state")
document.merch.state.focus()
return true
}
//checks to see if the data has been selected and alerts the user if false.
paymentmeth();
openNewWin();
subWrite();
//calling the two functions
}
function paymentmeth()
{
for (i = 0; i < document.merch.payway.length; i++){
if (document.merch.payway[i].checked == true){
//a loop that is used to determine the paymethod and checks to see if data has been entered
method = document.merch.payway[i].value
//declares method
}//ends IF
}//ends
//error control for nothing checked
if (method == false)
{
//if method equals nothing show alert
// this fails to validate
alert("You forgot to select Pay Method.")
}
//document.merch.paytype.value = method;
}
function emailForm(){
sendemail = "micha3l26@hotmail.com";
subject = "Order Details";
message = ("Clients Information firstname is "+firname +" Surname is "+ surname +" PhoneNumber is "+ phonenumber +" EmailAddress is "+ emailaddress +" Street Name and Number is "+ streetnamenumber +" Suburb is "+ yoursuburb +" Postcode is "+ postcode +" State is "+ yourstate +" Payment Method is "+ method +" Total Payment is "+ Cost);
mailto_link = ('mailto:'+sendemail+'?subject='+subject+'&body='+message);
win = window.open(mailto_link,"emailWindow");
if (win && win.open &&!win.closed)win.close();
}
//ends function
function openNewWin() {
var newWin;
newWin = window.open("","newWin","status,height=600,width=600")
//opens the window and sets it 600px by 600px
}
//open new window
function subWrite() {
if (newWin.closed) {
makeNewWin()
}
newWin.focus()
var image = "<img src=quote.jpg>";
//declares variable image as the banner jpg
newWin.document.write(image)
//document writes the variable image
newWin.document.write("<br/>");
newWin.document.write("<br/>");
newWin.document.write("Your FirstName is "+firname);
//writes the variable into the new document
newWin.document.write("<br/>");
newWin.document.write("Your Surname is "+surname);
//writes the variable into the new document
newWin.document.write("<br/>");
newWin.document.write("Your PhoneNumber is "+phonenumber);
//writes the variable into the new document
newWin.document.write("<br/>");
newWin.document.write("Your EmailAddress is "+emailaddress);
//writes the variable into the new document
newWin.document.write("<br/>");
newWin.document.write("Your Street Name and Number is "+streetnamenumber);
//writes the variable into the new document
newWin.document.write("<br/>");
newWin.document.write("Your Suburb is "+yoursuburb);
//writes the variable into the new document
newWin.document.write("<br/>");
newWin.document.write("Your Postcode is "+postcode);
//writes the variable into the new document
newWin.document.write("<br/>");
newWin.document.write("Your State is "+yourstate);
//writes the variable into the new document
newWin.document.write("<br/>");
newWin.document.write("Your Pay Method is "+method);
//writes the variable into the new document
newWin.document.write("<br/>");
newWin.document.write("Your total payment is "+Cost);
//writes the variable into the new document
newWin.document.write("<br/>");
newWin.document.write("<input type="button" onClick="emailForm()" value="Send Email"/> ");
//("<div style="border:2px solid black;padding:10px;">
//Please <a href="#" onclick="emailForm();">Email Support</a>
//</div>");
//a document write to input a button, with an onclick function to mailto a email address
var newContent = "</BODY></HTML>"
newWin.document.write(newContent)
newWin.document.close() // close layout stream
}
//calling the two functions
//the send email button does not work.
function tally()
{
//the function that calculates the prices of tshirts
Cost =0;
//sets the cost at 0
if (document.merch.tshirt1.checked)
{
Cost = Cost + parseInt(document.merch.tshirt1.value);
}
//cost which is 0 + the tshirt value equals the price of tshirt 1
//repeated 8 times
if (document.merch.tshirt2.checked)
{
Cost = Cost + parseInt(document.merch.tshirt2.value);
}
if (document.merch.tshirt3.checked)
{
Cost = Cost + parseInt(document.merch.tshirt3.value);
}
if (document.merch.tshirt4.checked)
{
Cost = Cost + parseInt(document.merch.tshirt4.value);
}
if (document.merch.tshirt5.checked)
{
Cost = Cost + parseInt(document.merch.tshirt5.value);
}
if (document.merch.tshirt6.checked)
{
Cost = Cost + parseInt(document.merch.tshirt6.value);
}
if (document.merch.tshirt7.checked)
{
Cost = Cost + parseInt(document.merch.tshirt7.value);
}
if (document.merch.tshirt8.checked)
{
Cost = Cost + parseInt(document.merch.tshirt8.value);
}
document.merch.Total.value = "$"+Cost;
}
</script>
Code: <style type="text/css">
<!--
.style1 {
font-family: Century Gothic;
color: #FFFFFF;
}
.style3 {font-family: Century Gothic; color: #FFFFFF; font-size: 24px; }
.style5 {color: #000000}
-->
<!--Declaring the different styles of text !-->
</style></HEAD>
<BODY BGCOLOR="BLACK">
<div align="center"><img src="mymerchbanner.jpg" width="787" height="158">
<!The placement of the main banner>
</div>
<HR>
<FORM NAME="merch" onSubmit="main()">
<!declaring the forms name and onsubmit run the function main>
<table width="368" border="1" bordercolor="#000000" bgcolor="#000000">
<tr>
<td width="187" height="40"><span class="style3">First Name: </span></td>
<td width="165"><input type="text" name="firstname" id="firstname"></td>
</tr>
<!firstname textboxes>
<tr>
<td height="45"><span class="style3">Last Name: </span></td>
<td><input type="text" name="lastname" id="lastname"></td>
</tr>
<!lastname textboxes>
<tr>
<td height="44"><span class="style3">Phone Number:</span></td>
<td><input type="text" name="phonenum" id="phonenum"></td>
</tr>
<!phonenumber textboxes>
<tr>
<td height="43"><span class="style3">Email Address:</span></td>
<td><input type="text" name="emailadd" id="emailadd"></td>
</tr>
<!emailaddress textboxes>
<tr>
<td><span class="style3">Street Name and Number:</span></td>
<td><input type="text" name="stnamenum" id="stnamenum"></td>
</tr>
<!streetnameandnumber textboxes>
<tr>
<td height="43"><span class="style3">Suburb:</span></td>
<td><input type="text" name="suburb" id="suburb"></td>
</tr>
<!suburb textboxes>
<tr>
<td height="42"><span class="style3">Postcode:</span></td>
<td><input type="text" name="pcode" id="pcode"></td>
</tr>
<!postcode textboxes>
<tr>
<td height="42"><span class="style3">State:</span></td>
<td> <select name="state" id="state">
<option value="SA">SA</option>
<option value="TAS">TAS</option>
<option value="QLD">QLD</option>
<option value="VIC">VIC</option>
<option value="NSW">NSW</option>
<option value="ACT">ACT</option>
<option value="NT">NT</option>
<option value="WA">WA</option>
<option value="Select" selected>Click to select</option>
</select> </td>
</tr>
<!state selection>
</table>
<p> </p>
<p class="style3">What Would you Like Today? </p>
<table width="684" border="0" bordercolor="#000000" bgcolor="#000000">
<tr>
<td width="79" class="style1">0001</td>
<td width="79">2<span class="style1">0002</span></td>
<td width="79"><span class="style1">0003</span></td>
<td width="79"><span class="style1">0004</span></td>
<td width="79"><span class="style1">0005</span></td>
<td width="79"><span class="style1">0006</span></td>
<td width="79"><span class="style1">0007</span></td>
<td width="79"><span class="style1">0008</span></td>
</tr>
<tr>
<td><img src="1.png" width="100" height="100"></td>
<td><img src="2.png" width="100" height="100"></td>
<td><img src="3.png" width="100" height="100"></td>
<td><img src="4.png" width="100" height="100"></td>
<td><img src="6.png" width="100" height="100"></td>
<td><img src="8.png" width="100" height="100"></td>
<td><img src="9.png" width="100" height="100"></td>
<td><img src="10.png" width="100" height="100"></td>
</tr>
<!tshirt images for the 8 shirts>
<tr>
<td><input type="checkbox" name="tshirt1" Value="15" onClick="tally()"> ></td>
<td><input type="checkbox" name="tshirt2" Value="15" onClick="tally()"> ></td>
<td><input type="checkbox" name="tshirt3" Value="15" onClick="tally()"> > </td>
<td><input type="checkbox" name="tshirt4" Value="30" onClick="tally()"> > </td>
<td><input type="checkbox" name="tshirt5" Value="30" onClick="tally()"> > </td>
<td><input type="checkbox" name="tshirt6" Value="15" onClick="tally()"> > </td>
<td><input type="checkbox" name="tshirt7" Value="15" onClick="tally()"> > </td>
<td><input type="checkbox" name="tshirt8" Value="15" onClick="tally()"> > </td>
</tr>
<!8 checkboxes with diffent values that are used to add up the prices and onclick run function tally>
<tr>
<td class="style1">$15</td>
<td class="style1">$15</td>
<td class="style1">$15</td>
<td class="style1">$30</td>
<td class="style1">$30</td>
<td class="style1">$15</td>
<td class="style1">$15</td>
<td class="style1">$15</td>
</tr>
<!text for prices>
</table>
<td> Total <INPUT TYPE="text" NAME="Total" value="0" size="7"></td>
<p class="style3">How Will you Like to Pay? </p>
<table width="268" border="0" align="center" bordercolor="#000000">
<tr>
<td width="196" class="style3">Cash on Delivery </td>
<td width="56"><input name="payway" type="radio" value="Cash"onClick="paymentmeth()"></td>
</tr>
<!radio button with different values and onclick run paymentmeth>
<tr>
<td class="style3">Bank Deposit </td>
<td><input name="payway" type="radio" value="Bank Deposit"onClick="paymentmeth()"></td>
</tr>
<tr>
<td class="style3">Paypal</td>
<td><p>
<input name="payway" type="radio" value="Paypal"onClick="paymentmeth()">
<label></label>
</p></td>
</tr>
</table>
<p> </p>
<p align="center" class="style3">
<INPUT TYPE="SUBMIT" VALUE="Show Invoice" onSubmit="main()">
<!submit button that runs function>
<span class="style5"> </span>
<input type="RESET" />
<!reset button that runs function>
<span class="style5"> </span>
</p>
</FORM>
</BODY>
</HTML>
|
|||||||