JavaScript - Adding Forms
I am trying to take the add the numbers input into form boxes 1 and 2 and then output them onto the screen following the form boxes. I have tried many different functions and none of them will work. Can anyone point me in the right direction? Here's my code so far:
Code: <!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> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Math and Compare</title> <link rel="stylesheet" type="text/css" href="assignment1.css" /> <div align="center"> <script type="text/javascript"> var title = "<strong>Assignment 1 </br> Aughtman, Zackary</strong>" document.write(title.fontsize(5)); </script> <script type="text/javascript"> function result_One(firstNum, secondNum, result1) { firstNum = document.getElementById("box1").value; secondNum = document.getElementById("box2").value; result_One = this.firstNum + this.secondNum; return calc.result_One; } </script> </head> <body> </br> </br> <div id="div1" align="center"> <strong>Addition</strong> </div> <table align = "center"> <tr> <td> <form id="box1"> <input type="text" value="" id="box1" class="box1" /> + <input type="text" value="" id="box2" class="box2" /> = 000000000 </br> <div align="center"> <input type="button" value="Add" id="add" onclick="result_One;" /> </td> </tr> </table> </body> </html> Similar TutorialsI have found a code to help me learn how to add forms in javascript, but it's limited to text input forms. Code: <script type="text/javascript"><!-- function updatesum() { document.form.sum.value = (document.form.sum1.value -0) + (document.form.sum2.value -0); } //--></script> Where the inputs sum1 and sum2 are text fields you put whatever numbers you want in. That works fine. Great. Now what I'm having trouble with is modifying the code so that it will add one form with an input number with a form that spits out a randomly generated number. Code: <input type="button" value="D20" onclick="this.form.display.value = Math.round (20 * Math.random())" class="buttonHi" /> <input name="display" type="text" size="6" value="" /> This is what I'm using for my random number generator. So basically I want to be able to put, say, 5, into the input text field above this. And then click on the d20 button to get a random number, say, 15, and then have the first code add the inputted 5 with the randomly generated 15. Is this possible? Hello all! I am using 'simplecartjs' as a simple shopping cart for my website. To checkout, the user e-mails me his cart containts. I would like to have his name, email and adress with this but i'm unable to add this to my shopping form. Here is my JS: Code: me.emailCheckout = function() { itemsString = ""; for( var current in me.items ){ var item = me.items[current]; itemsString += item.name + " " + item.quantity + " " + item.price + "\n"; } var form = document.createElement("form"); simpleCart.empty(); form.style.display = "none"; form.method = "POST"; form.action = "sendjs.php"; form.acceptCharset = "utf-8"; form.appendChild(me.createHiddenElement("jcitems", itemsString)); form.appendChild(me.createHiddenElement("jctotal", me.total)); document.body.appendChild(form); form.submit(); document.body.removeChild(form); } And here is the PHP that sends is (sendjs.php): Code: <?php $to = 'info@kheuning.nl'; $subject = 'the subject'; $jcitems = $_POST['jcitems']; $headers = 'From: webmaster@example.com' . "\r\n" . 'Reply-To: webmaster@example.com' . "\r\n" . 'X-Mailer: PHP/' . phpversion(); mail($to, $subject, $jcitems, $headers); Header('Location: thankyou.html'); ?> I understand how to add variables to send in my php form, but it doesn't take normale html form input's i add to the page. How can i add these to the js? Thanks in advance! Jonas Hey CF, I'm currently working on a website called 'eXtreme Gaming' I've almost completed it, apart from two things. - Adding two values on my checkout page for the Grandtotal (I've tried everything, but I'm too much of a noob and have probably missed something small). - Validation of forms (I don't know where to start here, I've looked on w3schools for tuts etc but I'm having difficulty incorporating it on my site) I'm going to put the code for my checkOut page only, if you are able to help me many thanks in advance. [quote] Code: <HTML> <HEAD> <script language="JavaScript" src="laptopsCookie.js"> </script> <script language="JavaScript" src="desktopsCookie.js"> </script> <script language="JavaScript"><!-- function calculateTotalPurchaseLaptop(formRef) { var laptopTotal=0; for (var i=0; i<LaptopListPurchase.length/2;i++) { var subTotal = formRef.elements['quantity'+i].value * formRef.elements['price'+i].value; formRef.elements['subTotal'+i].value = subTotal.toFixed(2); // document.orderForm2.grandTotal.value = document.orderForm.laptopTotal.value + document.orderForm2.desktopTotal.value laptopTotal += subTotal; } formRef.laptopTotal.value = laptopTotal.toFixed(2); } //--></script> <script language="JavaScript"><!-- function calculateTotalPurchaseDesktop(formRef) { var desktopTotal=0; for (var i=0; i<DesktopListPurchase.length/2;i++) { var subTotal = formRef.elements['quantity'+i].value * formRef.elements['price'+i].value; formRef.elements['subTotal'+i].value = subTotal.toFixed(2); desktopTotal += subTotal; } formRef.desktopTotal.value = desktopTotal.toFixed(2); } //--></script> <script language="Javascript"><!-- function checkform() { if (document.payment.Name.value == "") { alert('Please enter a name'); return false; } //else if(isNaN(document.payment.CreditCard.value) || document.payment.CreditCard.length !== 10) //{ // alert('Invalid Credit Card Number'); // return false; //} else if (document.payment.Adress.value == "") { alert('Please enter your adress.'); return false; } else if (document.payment.State.selectedIndex == 0) { alert('Please select a state'); return false; } return true; } </script> </HEAD> <BODY> <TITLE>Check Out</TITLE> <script> var html = ""; html += '<TABLE align="center"><tr><td><img src = "images/checkOutTitle.png" align="center" style="border:none" /></td></tr></TABLE>'; html += '<TABLE align = "center" border="2" cellpadding="2" cellspacing="2" width="80%">' html += '<form id = "orderForm" name = "orderForm" method = POST action="javascript:void(0)">'; html += '<tr>'; html += '<th>Product</th><th>Quantity</th><th>Price</th><th>Sub Total</th>'; html += '</tr>'; for (var i=0; i<LaptopListPurchase.length;i=i+2) { html += '<tr><td>' + LaptopListPurchase[i] + '</td>'; html += '<td><select NAME="quantity' + i/2 + '" onChange="calculateTotalPurchaseLaptop(this.form)">'; html += '<OPTION VALUE="0">0</OPTION><OPTION VALUE="1">1</OPTION><OPTION VALUE="2">2</OPTION>'; html += '<OPTION VALUE="3">3</OPTION><OPTION VALUE="4">4</OPTION><OPTION VALUE="5">5</OPTION>'; html += '</select></td>'; html += '<td>$<input type="text" name="price' + i/2 + '" size=5 value="' + LaptopListPurchase[i+1] + '" readonly></td>'; html += '<td>$<input type="text" name="subTotal' + i/2 + '" size=5 value="0.00" readonly></td>'; html += '</tr>'; } html += '<tr>'; html += '<td></td>'; html += '<td></td>'; html += '<td></td>'; html += '<td>$<input type=TEXT name="laptopTotal" value="" readonly size=7></td></tr>'; html += '</form>'; html += '</table>'; document.write(html); // Update the quantities // var quantityLaptop; for (var i=0; i<LaptopList.length/2;i++) { // Get the quantity of each type of Laptop // quantityLaptop = getCookie("Laptop" + i); document.orderForm.elements("quantity"+i).value = quantityLaptop; } // Update the totals // calculateTotalPurchaseLaptop(document.orderForm) var html = ""; html += '<TABLE align = "center" border="2" cellpadding="2" cellspacing="2" width="80%">' html += '<form id = "orderForm2" name = "orderForm2" method = POST action="javascript:void(0)">'; html += '<tr>'; html += '<th>Product</th><th>Quantity</th><th>Price</th><th>Sub Total</th>'; html += '</tr>'; for (var i=0; i<DesktopListPurchase.length;i=i+2) { html += '<tr><td>' + DesktopListPurchase[i] + '</td>'; html += '<td><select NAME="quantity' + i/2 + '" onChange="calculateTotalPurchaseDesktop(this.form)">'; html += '<OPTION VALUE="0">0</OPTION><OPTION VALUE="1">1</OPTION><OPTION VALUE="2">2</OPTION>'; html += '<OPTION VALUE="3">3</OPTION><OPTION VALUE="4">4</OPTION><OPTION VALUE="5">5</OPTION>'; html += '</select></td>'; html += '<td>$<input type="text" name="price' + i/2 + '" size=5 value="' + DesktopListPurchase[i+1] + '" readonly></td>'; html += '<td>$<input type="text" name="subTotal' + i/2 + '" size=5 value="0.00" readonly></td>'; html += '</tr>'; } html += '<tr>'; html += '<td></td>'; html += '<td></td>'; html += '<td></td>'; html += '<td>$<input type=TEXT name="desktopTotal" value="0.00" readonly size=7></td></tr>'; html += '<td></td>'; html += '<td></td>'; html += '<td align = "center"><b>Grand Total</b></td>'; html += '<td>$<input type=TEXT name="grandTotal" value="0.00" readonly size=7></td></tr>'; html += '</form>'; html += '</table>'; document.write(html); // Update the quantities // var quantityDesktop; for (var i=0; i<DesktopList.length/2;i++) { // Get the quantity of each type of Desktop // quantityDesktop = getCookie("Desktop" + i); document.orderForm2.elements("quantity"+i).value = quantityDesktop; } // Update the totals // calculateTotalPurchaseDesktop(document.orderForm2) </script> <table align = 'center'> <tr> <td><h1>Pay for your Purchase Below</h1></td> </tr> </table> <table border="1" align = 'center' > <form name="payment" method="post"> <tr> <td> Name on Credit Card: <input type="text" name="Name" /><br /> Credit Card number: <input type="text" name="CreditCard" /><br /> Street Adress: <input type="text" name="Adress" /><br /> Town: <input type="text" name="Town" /><br /> State/Territory: <select NAME="State"><OPTION VALUE="Null">--</OPTION><OPTION VALUE="Australian Capital Territory">ACT</OPTION><OPTION VALUE="South Australia">SA</OPTION><OPTION VALUE="Northen Territory">NT</OPTION><OPTION VALUE="Queensland">QLD</OPTION><OPTION VALUE="Victoria">Vic</OPTION><OPTION VALUE="Western Australia">WA</OPTION><OPTION VALUE="Tasmania">Tas</OPTION></select> </td> <td> <INPUT TYPE="RADIO" NAME="Master Card" VALUE="Master Card">Master Card<BR> <INPUT TYPE="RADIO" NAME="Visa" VALUE="Visa">Visa<BR> <INPUT TYPE="RADIO" NAME="AMEX" VALUE="American Express">American Express<BR> </td> </tr> <tr> <td></td> <td><input type="submit" value="Submit" onclick="return checkform()"></td> </tr> </table> </BODY> </HTML>[ /quote] I'm using the autofill forms plugin for firefox which can be found he https://addons.mozilla.org/en-US/firefox/addon/4775 I use it to automatically fill various web forms, duh. But I would like certain values to be chosend randomly from a list I create. I contacted the developer and he said the add on probably does not need a new feature because there is a 'dynamic tags' function to fill certain forms with dynamic values (e.g. the current time or date). He has given over the project to another developer and told me I probably would find a solution in a good javascript programming forum. So here I am! Can anyone help me with this? Basically, I just need a javascript code which chooses on item from an array randomly, I guess? I'm not a programmer myself, so any help would be greatly (!) appreciated. Thanks a lot in advance for any further guidance! Note: Here are sample dynamic tags from the plugin: <datetime> new Date().toLocaleString() <useragent> navigator.userAgent <langcode> navigator.language <resolution> screen.width+'x'+screen.height <clipboard> this.getClipboardText() Hello, I have a tricky one here. What I have is a form where the user would enter in their food recipe. There is nothing clever in that until I need them to enter in the ingredients and the quantity into 2 seperate fields. The issue is that I don't know how many different ingredients there would be for the recipe so from within the form before the record is saved I need them to be able to fill out the 2 fields as many times as they need to (pressing a button each time) and I would have thought for the data to be held in a javascript array that i could then write away into the mysql table? I probably haven't made much sense. Can anyone help? Okay well here is my code. i want to mkae it so the functions add together to get a total price, i need some help Code: <html> <head> </head> <script type="text/javascript"> function addit(){ if(document.getElementById("add").value=="0") { document.getElementById("amount").value="$0.00" } if(document.getElementById("add").value=="1") { document.getElementById("amount").value="$5.00" } if(document.getElementById("add").value=="2") { document.getElementById("amount").value="$10.00" } if(document.getElementById("add").value=="3") { document.getElementById("amount").value="$15.00" } } function addit2(){ if(document.getElementById("add2").value=="4") { document.getElementById("amount").value="$30.00" } if(document.getElementById("add2").value=="5") { document.getElementById("amount").value="$40.00" } } </script> <body> <table class="comparison pricing-email" border="0" cellspacing="1" cellpadding="0" width="30%"> <tbody> <tr class="row1"> <td class="col1">Choose # of EMAIL accounts: <select style="width: 60px; font-size: 17px;" name="add" id="add" onChange="addit()"> <option value="0"> </option> <option value="1">1</option> <option value="2">3</option> <option value="3">6</option> </select> </td> </tr> <tr class="row2"> <td class="col2">Choose # of EMAIL accounts: <select style="width: 60px; font-size: 17px;" name="add" id="add2" onChange="addit2()"> <option value="0"> </option> <option value="4">44</option> <option value="5">43</option> <option value="3">342</option> </select> </td> </tr> <tr class="row1"> <td class="col1">Total Price: <input type="text" id="amount" value="" style="border:none; font-size:13pt;"></td> </tr><tr> <td> <input type="submit" name="submit" value="Sign-Up"> </td> </tr> </tbody> </table> </form> </body> Hi , I want to make few forms but 1 submit button. I want to do 1 page , 5 forms , 1 submit button so when i click on the submit button it will send the 5 forms as 1 form. how I can so that? thanks , Mor. Forgive me if this isn't in the right spot. I'm new at php and java so bear with me. I have small form I found and modified. This works as I wanted it to. Code: <HEAD> <SCRIPT LANGUAGE="JavaScript"> <!-- Begin function solveALK(form) { var alkalinity = eval(form.alkalinity.value); var alkneeds = eval(form.alkneeds.value); var change = (alkneeds) - (alkalinity); var add1 = (change) / (10) * (0.075) * (1.5) * (16); var add2 = (add1) / (16); form.alkchange.value = change; form.addoz.value = add1; form.addlbs.value = add2; } // End --> </script> </HEAD> <!-- STEP TWO: Copy this code into the BODY of your HTML document --> <BODY> <center> <table> <tr><td> </td> </tr> </table> <form method=post name=alkform> <table border=4> <tr> <td align=center> Alkalinity </td> <td align=center> <input type=text name=alkalinity size=3> </td> <td align=center> Needs to be: </td> <td align=center> <input type=text name=alkneeds size=3> </td> </tr> <tr> <td align=center> Change required: </td> <td colspan=3 align=center> <input type=text name=alkchange size=3> </td> </tr> <tr> <td align=center> Add this amount </td> <td colspan=3 align=center> <input type=text name=addoz size=3>oz </td> </tr> <tr> <td align=center> Add this amount </td> <td colspan=3 align=center> <input type=text name=addlbs size=3>lbs </td> </tr> <tr> <td colspan=4 align=center> <input type=button name=alk value="Calculate" onClick="javascript:solveALK(this.form)"> </td> </tr> </table> </form> </center> However when I put this into my php file, When I add my 2 figures to the input boxes. and click the calculate button, I get a NaN. I'm thinking it might be because I have 2 forms on my php page. One area of the page will update the database while this one would just calculate some figures. Here's the php page that doesn't seem to work. Code: <html> <head> <link rel="stylesheet" type="text/css" href="../style1.css" /> <title>Pool Log Report</title> <SCRIPT LANGUAGE="JavaScript"> <!-- Chemical calulations --> <!-- Begin function solveALK(form) { var alkalinity = eval(form.alkalinity.value); var alkneeds = eval(form.alkneeds.value); var change = (alkneeds) - (alkalinity); var add1 = (change) / (10) * (0.075) * (1.5) * (16); var add2 = (add1) / (16); form.alkchange.value = change; form.addoz.value = add1; form.addlbs.value = add2; } // End --> </script> </head> <body class="body"> <center> <table class="main1"> <?php include("update_header.php"); ?> <form action="updated.php" method="post" name="FormName"> <tr> <td class="main2"><input id="Dayid" name="Dayid" type="text" size="1" value="<?php echo $Dayid ?>" maxlength="2" readonly></td> <td class="main3"> </td> <td class="main3"><input id="patron_loading_max" name="patron_loading_max" type="text" size="1" value="<?php echo $patron_loading_max ?>" maxlength="2"></td> <td class="main3"><input id="patron_loading_24hr" name="patron_loading_24hr" type="text" size="1" value="<?php echo $patron_loading_24hr ?>" maxlength="2"></td> <td class="main3"><input id="water_clearity__clear" name="water_clearity__clear" type="checkbox" <?php if ($water_clearity__clear == "X") { echo "checked";} ?> value="X"></td> <td class="main3"><input id="water_clearity__turbid" name="water_clearity__turbid" type="checkbox" <?php if ($water_clearity__turbid == "X") { echo "checked";} ?> value="X"></td> <td class="main3"><input id="water_temp" name="water_temp" type="text" size="1" value="<?php echo $water_temp ?>" maxlength="3"></td> <td class="main3"><input id="psi" name="psi" type="text" size="1" value="<?php echo $psi ?>" maxlength="3"></td> <td class="main3"><input id="gpm" name="gpm" type="text" size="1" value="<?php echo $gpm ?>" maxlength="3"></td> <td class="main3"><input id="drain_back" name="drain_back" type="text" size="1" value="<?php echo $drain_back ?>" maxlength="5"></td> <td class="main3"><input id="chlorine_am1" name="chlorine_am1" type="text" size="1" value="<?php echo $chlorine_am1 ?>" maxlength="5"></td> <td class="main3"><input id="chlorine_am2" name="chlorine_am2" type="text" size="1" value="<?php echo $chlorine_am2 ?>" maxlength="5"></td> <td class="main3"><input id="ph_am1" name="ph_am1" type="text" size="1" value="<?php echo $ph_am1 ?>" maxlength="5"></td> <td class="main3"><input id="ph_am2" name="ph_am2" type="text" size="1" value="<?php echo $ph_am2 ?>" maxlength="5"></td> <td class="main3"><input id="chlorine_pm1" name="chlorine_pm1" type="text" size="1" value="<?php echo $chlorine_pm1 ?>" maxlength="5"></td> <td class="main3"><input id="chlorine_pm2" name="chlorine_pm2" type="text" size="1" value="<?php echo $chlorine_pm2 ?>" maxlength="5"></td> <td class="main3"><input id="ph_pm1" name="ph_pm1" type="text" size="1" value="<?php echo $ph_pm1 ?>" maxlength="5"></td> <td class="main3"><input id="ph_pm2" name="ph_pm2" type="text" size="1" value="<?php echo $ph_pm2 ?>" maxlength="5"></td> <td class="main3"><input id="combined_chl" name="combined_chl" type="text" size="1" value="<?php echo $combined_chl ?>" maxlength="4"></td> <td class="main3"><input id="alkalinity" name="alkalinity" type="text" size="1" value="<?php echo $alkalinity ?>" maxlength="3"></td> <td class="main3"><input id="chemicals_add" name="chemicals_add" type="text" size="1" value="<?php echo $chemicals_add ?>" maxlength="55"></td> <td class="main3"><input id="chemicals_qty" name="chemicals_qty" type="text" size="1" value="<?php echo $chemicals_qty ?>" maxlength="55"></td> <td class="main3"><input id="super_oxidation" name="super_oxidation" type="text" size="1" value="<?php echo $super_oxidation ?>" maxlength="3"></td> <td class="main4" class="main3"> </td> </tr> <tr> <td class="main4" colspan="24"> </td> </tr> <form method=post name=alkform> <tr> <td class="main2" colspan="3"> </td> <td class="main2" colspan="5"><b>Whirlpool Calculations</b></td> <td class="main2" colspan="5"> </td> <td class="main2" colspan="5"><b>Chlorine Shocking</b></td> <td class="main2" colspan="2"><b>FAS-DPD</b></td> <td class="main2" colspan="3"><b>Chlorine No-Shock</b></td> <td class="main2"> </td> </tr> <tr> <td class="main4" rowspan="3" colspan="3"> </td> <td class="main2" colspan="2">Alkalinity</td> <td class="main2"><input type=text name=alkalinity size=3></td> <td class="main2" colspan="2"> </td> <td class="main2" colspan="2">Calcium</td> <td class="main2"><input id="Calcium" name="Calcium" type="text" size="1" value="<?php echo $Calcium ?>" maxlength="3"></td> <td class="main2" colspan="2"> </td> <td class="main2" colspan="3">Drops</td> <td class="main2"><input id="R0871_drops" name="R0871_drops" type="text" size="1" value="<?php echo $R0871_drops ?>" maxlength="3"></td> <td class="main2" colspan="2">Breakpoint</td> <td class="main2"><?php echo $Breakpoint ?></td> <td class="main2" colspan="2">Needs to be:</td> <td class="main2"><input id="Chl_Needs" name="Chl_Needs" type="text" size="1" value="<?php echo $Chl_Needs ?>" maxlength="3"></td> <td class="main4" rowspan="3"> </td> </tr> <tr> <td class="main2" colspan="2">Needs to be:</td> <td class="main2"><input type=text name=alkneeds size=3></td> <td class="main2">Change:</td> <td class="main2"><input type=text name=alkchange size=3></td> <td class="main2" colspan="2">Needs to be:</td> <td class="main2"><input id="Cal_Needs" name="Cal_Needs" type="text" size="1" value="<?php echo $Cal_Needs ?>" maxlength="3"></td> <td class="main2"">Change:</td> <td class="main2"><?php echo $Cal_Change ?></td> <td class="main2" colspan="3">Free Chl</td> <td class="main2"><?php echo $Free_Chl ?></td> <td class="main2">ppm</td> <td class="main2" colspan="2">Amt to shock</td> <td class="main2" colspan="2">Change Required</td> <td class="main2"><input id="Chl_Change" name="Chl_Change" type="text" size="1" value="<?php echo $Chl_Change ?>" maxlength="3" readonly></td> </tr> <tr> <td class="main2" colspan="3">Add Sodium BiCarb</td> <td class="main2"><input type=text name=addoz size=3></td> <td class="main2">Oz</td> <td class="main2" colspan="3">Add Calcium</td> <td class="main2"><?php echo $Cal_Add_oz ?></td> <td class="main2">Oz</td> <td class="main2" colspan="3">Drops</td> <td class="main2"><input id="R0003_drops" name="R0003_drops" type="text" size="1" value="<?php echo $R0003_drops ?>" maxlength="3"></td> <td class="main2"> </td> <td class="main2"><?php echo $AmtShk_oz ?></td> <td class="main2">oz</td> <td class="main2" colspan="2">Add this in oz</td> <td class="main2"><input id="Chl_Add" name="Chl_Add" type="text" size="1" value="<?php echo $Chl_Add ?>" maxlength="3"></td> </tr> <tr> <td class="main4" colspan="6"> </td> <td class="main2"><input type=text name=addlbs size=3></td> <td class="main2">Lbs</td> <td class="main2" colspan="3"> </td> <td class="main2"><?php echo $Cal_Add_lbs ?></td> <td class="main2">Lbs</td> <td class="main2" colspan="3">Combined Chl</td> <td class="main2"><?php echo $Comb_Chl ?></td> <td class="main2">ppm</td> <td class="main2"><?php echo" ".number_format($AmtShk_gal,2); ?></td> <td class="main2">Gal</td> <td class="main4" colspan="6"> </td> </tr> <tr> <td colspan="24" align="center" class="main2">Make your changes and click the update button below.</td> </tr> <tr> <td colspan="24" align="center" class="main2"><input type=button name=alk value="Calculate" onClick="javascript:solveALK(this.form)"></form> <input type="button" value="Update" onclick="this.form.action='updated.php'; this.form.submit();"><input type="hidden" name="id" value="id"> <INPUT TYPE="button" VALUE="Back" onClick="history.go(-1);return true;"></td> </tr> </table> </form> </center> If I am correct that I need to separate the forms. How do I do so? Or am I going about this wrong? I am building a website for a client. This will involve some tricky form work. There will be forms on 2 pages. The first will be of generic questions such as: "How many windows in you household?" After these questions are answered, a "Continue" button would be pressed. Then "Do you want your windows cleaned?" would be an option on the second page. At the end of that form on the second page, it would calculate the true answers with the filled in info from the first page. This is the way the client wants it. How would I go about this? I've been looking for ways to get seperate forms to cooperate with each other, I'd assume with ID tags and such, but can't find any good help. Any insight would be great!! Hello, I'm looking for an example on adding items from a popup window to my current form. So I have a form where a user will request some data and one of the options is to request certain files. So, I would like to add a button which allows the user to open a separate window to choose some files to associate with the form/request. I would then like to see those items show up in my current form . I hope this makes sense :-) Thanks, tom When I click Vacant after 5 and it goes to occupied. How would I make it come back to vacant when clicked again? Code: <html> <head> <script type="text/javascript"> function fillForm() { if (counter > 10){ } } </script> <script type="text/javascript"> function StartCounting(){ setInterval("DoCounting()", 1000) } var Counter = 0; function DoCounting(){ var obj = document.getElementById('countingtext'); obj.innerHTML = '' + Counter; Counter++; if( Counter > 5) { var obj1 = document.getElementById("closed").value = "Open"; var space1 = document.getElementById("space1") space1.onclick = linkClick; } } function linkClick(){ space1 = document.getElementById("space1").value = "Occupied"; } </script> </head> <body onload= "StartCounting()"> Open at 5: <span id="countingtext"></span> </body> </html> <div style="margin-right:3mm; " > <form action="#" method="post" id="theForm" > <input size="10" id="closed" value="Closed" style="text-align:center;" /> <script type="text/javascript"> </script> <input type='button' id="space1" name='s"+ i+"' value='Vacant' onclick='readSpace(s"+ i+")' style='width:15mm;' /></td> </form> </div> I'm right at the beginning of learning javascript and having trouble with my first project Code: <html> <head> </head> <body> <form onsumbit="return add_hq()"> Headquarters: <select name="ork_hq_list" id="ork_hq_list" > <option value="warboss.html">Warboss<br /> <option value="big_mek.html">Big Mek<br /> <option value="weirdboy.html">Weirdboy<br /> </select> <input type="submit" value="Add"/> </form> <script type="text/javascript"> function add_hq() { hq = document.getElementById("ork_hq_list"); window.open("hq.options[hq.selectedIndex].value","Warboss","width=700"); return false; }; </script> </body> </html> Basically I have a 3 element drop-down form that is supposed to pop up a small window depending on what choice is selected when the submit button is pressed, but the selection is not getting to the code somehow. Can anyone see what I've done wrong? Im very much a beginner and just wanted to test out using forms and displaying results using the Javascript IF statement. Below is what Im trying to do which is see how a form works and display the entered data using the Javascript IF statement but I'm confused on why it won't work. <html> <head> <script type="text/javascript"> if (myNum == 7){ document.write("7"); } else { document.write("not 7"); } </script> </head> <body> <p><font size="5">Trying to understand the text box in forms and displaying results using Javascipt</font></p> <hr /> <form method="get" name="jsform"> <input type="text" name="myNum"> <input type="submit" value="SUBMIT"> </form> </body> </html> I need help and a good Beginners book to read thanks John Hi all - I'm having difficulty with the processing of 3 forms on my web page. We'll call my 3 forms A, B, and C. By default my page shows form A. The other 2 forms I have hidden via display:none My issue is when I have form B or C showing. Once I hit submit, say within form B for example, I'd like this form to remain for future entries/submital of data. However, instead what happens is form A appears. How do I get form B to remain, allowing for a user to submit multiple entries of data without going back to form A? Here's my code for form 'B' <div id="branches_info" style=" <?php echo $display_branches; ?> "> form method="post" action="annual_report_main.php" onsubmit="return validateBranches(this);"> <fieldset> <p><strong>Branch Location</strong></p><br /> <label for="branch_address" class="long">Street Address:</label> <input maxlength="50" type="text" name="branch_address" id="branch_address" value="<?php echo htmlentities($_POST['branch_address']);?>" /><br /> <div class="cleaner"></div> <label for="branch_city" class="long">City:</label> <input maxlength="20" type="text" name="branch_city" id="branch_city" value="<?php echo htmlentities($_POST['branch_city']);?>" /><br /> <div class="cleaner"></div> <label for="branch_state" class="long">State:</label> <input maxlength="2" type="text" name="branch_state" id="branch_state" value="<?php echo htmlentities($_POST['branch_state']);?>" /><br /> <div class="cleaner"></div> <label for="branch_zip" class="long">Zip Code:</label> <input maxlength="10" type="text" name="branch_zip" id="branch_zip" value="<?php echo htmlentities($_POST['branch_zip']);?>" /><br /> <div class="cleaner"></div> <div class="content_onecolumn"> <input type="submit" name="Branches" value="Submit to Database" class="inputSubmit" /> </div> <div class="content_onecolumn"> <input type="button" name="Finished" value="Finished" class="inputSubmit" onclick="window.open('https://www.dca.ca.gov/webapps/bppe/thankyou.php');return false" /> </div> </fieldset> </form> </div> I am trying to set up a form for paypal where the amount (cost) of the product is based on the currency chosen. I am trying to set this up using javascript which would submit the form and change the amount in the form. However, as a beginner, I am having some issues. This is what I have currently: Code: <html> <head> <script type="text/javascript"> function CalculateOrder(theform) { var currency = theform.currency_code.value; if (currency == "GBP") { theform.amount.value = "1.29" } else if (currency == "USD") { theform.amount.value = "1.99" } else if (currency == "EUR") { theform.amount.value = "1.39" } document.payform.submit(); } </script> </head> <body> <form target="paypal" action="https://www.paypal.com/cgi-bin/webscr " method="post" name="payform"> <input type="hidden" name="on0" value="Currency"> <select name="currency_code"> <option value="GBP" selected >GBP</option> <option value="USD">USD</option> <option value="EUR">EUR</option> </select> </p> <input type="image" src="https://www.paypal.com/en_US/i/btn/btn_buynowCC_LG.gif " onClick="CalculateOrder(this.form)" alt="Make payments with PayPal - it's fast, free and secure!"> <input type="hidden" name="add" value="1"> <input type="hidden" name="cmd" value="_xclick"> <input type="hidden" name="business" value="myemail@gmail.com"> <input type="hidden" name="item_name" value="My Prouct"> <input type="hidden" name="amount" value="0.00"> <input type="hidden" name="shipping" value="0"> <input type="hidden" name="no_shipping" value="1"> </form> </fieldset> </body> </html> The javascript is executed but clicking the image submits the form before the javascript runs and I am worried that the javascript may not run before the form is submitted so the amount would not be calculated - please help! I do not want to calculate the costs based on the exchange rate. I would really prefer (and also find it simpler) to just specify the cost in each currency. Thanks in advance! the following javascript code is for a page that has to different login sections (username and password) hospital admin i want them to login in their part using normal IDs(numbers) and password, and normal users to login in the other login boxes (using email address and password) , each login boxes have their own submit button. the problem is i can't check each of them alone. what i want to do is that if (for user) email and password entered and pressed his login button, to be headed to another page, while if hospital admin entered his id and password in his section and pressed login button, to be headed for a different page. help please ! Code: window.onload = initForms; function initForms() { for (var i=0; i< document.forms.length; i++) { document.forms[i].onsubmit = function() {return checkFields();} } } function checkFields(){ if(document.getElementById("userLogin").onclick) { if(isEmail(document.getElementById("userUsername").value)==false) { alert("Please enter a valid e_mail address."); document.getElementById("userUsername").focus(); return false; } if(document.getElementById("userUsername").value=="") { alert("Please enter your e_mail address."); document.getElementById("userUsername").focus(); return false; } if(document.getElementById("userPassword").value=="") { alert("Please enter your password."); document.getElementById("userPassword").focus(); return false; } } if(document.getElementById("hospLogin").onclick) { if(document.getElementById("hospUsername").value=="") { alert("Please enter your ID."); document.getElementById("hospUsername").focus(); return false; } if(document.getElementById("hospPassword").value=="") { alert("Please enter your password."); document.getElementById("hospPassword").focus(); return false; } } } function isEmail(mail) { var char1 = mail.split("@"); var y = mail.indexOf("@", 0); var e = mail.indexOf(".", 0); var w = mail.lastIndexOf(".", mail.length - 1); var sp = mail.indexOf(" ", 0); var pl = mail.indexOf("@.", 0); for (i = 0; i < mail.length; i++) { if (mail.charAt(i) == "/" || mail.charAt(i) == ":" || mail.charAt(i) == ";" || sp > 0 || pl > 0 || mail.charAt(i) == '"' || char1.length > 2 || y == -1 || y == 0 || e == 0 || w == mail.length - 1 || e == -1) { return false; } } } and there goes the HTML codes: Code: <!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="stylesheet" href="script.css" /> <script type="text/javascript" src="script.js"></script> <title>Blood high res END</title> </head> <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <div id="apDiv4" style="background:url(images/Blood-high-res-END_04.jpg) no-repeat"></div> <div id="apDiv1" style="background:url(images/Blood-high-res-END_01.jpg)"> <p>Hospital</p> <form name="hospForm" id="hospForm"> <input type="text" name="hospUsername" id="hospUsername" class="reqd" /><br /> <input name="hospPassword" type="password" id="hospPassword" class="reqd" /><br /><br /> <input name="submit" type="submit" id="hospLogin" value="Hospital log in" /></form></div> <div id="apDiv2" style="background:url(images/Blood-high-res-END_02.jpg)"></div> <div id="apDiv3" style="background:url(images/right.jpg)"> <a id="register" href="../User Registration Page/page.html" target="_self">Register Now</a> <a id="links" href="../Links/page.html" target="_self">Links</a> <p>Visitor</p> <form name="userForm" id="userForm"> <input type="text" name="userUsername" id="userUsername" class="reqd" /><br /> <input name="userPassword" type="password" id="userPassword" class="reqd" /><br /><br /> <input name="submit" type="submit" id="userLogin" value="User log in" /><br /></form> <a id="register2" href="../User Registration Page/page.html" target="_self">Register now</a><br /> <a id="forgot" href="../User Forgot Password/page.html" target="_self">Forgot Password</a></div> <div id="apDiv5" style="background:url(images/Blood-high-res-END_05.jpg) no-repeat"></div> <div id="apDiv6" style="background:url(images/Blood-high-res-END_06.jpg) no-repeat"> <p>Hello and welcome to Red Drop. By visiting our page,<br />you ensure to each and every one of the team crew <br />behind the stage, and to every lebanese person that<br />you are mentally prepared to donate a few drops of your<br />blood to the benefit of an anonymous stranger.<br /><br />With every drop you donate, you might be giving<br />a father, a mother or a child another day to live among<br />his family and his beloved persons.<br /><br />Register today and add donation blood to your frequently<br />social and humanitarian activities.</p> </div> <div id="apDiv7" style="background:url(images/Blood-high-res-END_07.jpg) no-repeat"></div> <div id="apDiv8" style="background:url(images/Blood-high-res-END_08.png) no-repeat"></div> <div id="apDiv9" style="background:url(images/Blood-high-res-END_09.jpg) no-repeat"></div> </body> </html> I havent added the server side scripts yet, i am planning to validate forms as much as possible using javascript first, and this is not for a real hospital, it's a graduation project, so to explain the point, on the page i have 2 seperated forms wich each having its own submit button, one to be used by hospital admins, and other to be used by users. For admins i just want to make sure their fields are not empty. For users i want to make sure their fields are not empty and their email field is valid. but when trying it, it's kinda only checks for the user fields. P.S: I apologize about not using codes, i didn't knew about this option. Hello. I am using javascript to create a dynamic form to allow me to add multiple items to the form before posting... this is the code: Code: if (!$_POST) { ?> <title>Adding elements to a form</title> <form name="form1" enctype="multipart/form-data" action="" method="post"> <div ID="Items"> <b>Dog 1:</b> <input type="text" name="Item1" size="45"> <br> <input type="button" value="Add Item" onClick="AddItem();" ID="add"> <input type="submit" name ="submit" value="Submit Form" > </div> </form> <? } else { echo print_r ($_POST); } ?> <script language="javascript"> var items=1; function AddItem() { div=document.getElementById("Items"); button=document.getElementById("add"); items++; newitem="<b>Dog " + items + ": </b>"; newitem+="<input type=\"text\" name=\"Item" + items ; newitem+="\" size=\"45\"><br>"; newnode=document.createElement("span"); newnode.innerHTML=newitem; div.insertBefore(newnode,button); } </script> It works but each element in the printed post array shows as Item1, Item2 etc with each being a seperate array... How can I make it so that I have a single posted array called Item with that array then having elements Item[1] etc up to the number of elements I add... Any help would be appreciated I have a problem with some forms and utilizing the proper code to make them work. Need some help if anyone out there has some working knowledge could help let me now, anyone ?? Eric I will post the code and the problem if someone would chim in thanks |