JavaScript - Problems With Feedback Form
Hi
This is a pretty easy beginner question I'm trying to doa feedback form for my website but having problems with the send button here is my code could someone tell me where i'm going wrong <html> <title>Feedback form</title> <body> <h2> Feedback Form </h2> <form> <FORM METHOD = Post ACTION = mailto:julie_bloggs@hotmail.co.uk> <p>E-mail: <INPUT TYPE = text NAME = Email SIZE = 30 <p>Please enter your name:<INPUT TYPE = text NAME =readeR <br> Could you fill in this survey please <br> Do you live in New Brighton? <br><INPUT TYPE = checkbox NAME = Yes>Yes <br><INPUT TYPE = checkbox NAME = No>No <br><INPUT TYPE = checkbox NAME = Moving>Moving soon <p>Your Comments <br> <TEXTAREA NAME = Address ROWS=4 COLS=40> </TEXTAREA> <P> <INPUT TYPE =Submit VALUE = "Send"> <INPUT TYPE =reset VALUE = "clear the form"> </FORM> </HTML> Similar TutorialsHave a look at the java script feedback form on this page http://christmas.cre8tivebug.com/ the button is on the right hand side of the browser window.. when you click on it the feed back form shows up in the center of the screen and dims out the background.. does anybody know where i can get this script Thanks I completed a simple JavaScript program which calculates the area of the 4 walls of house (so post to represent the total are to be painted). I am simply looking for feedback on how to make the code better and/or simpler. Code: <html xmlns = "http://www.w3.org/1999/xhtml"> <head> <title>Calculate Total Area To Be Painted</title> <script type = "text/javascript"> <!-- function calculate() {wall1_width = window.document.form1.wall1w.value; wall1_height = window.document.form1.wall1h.value; wall2_width = window.document.form1.wall2w.value; wall2_height = window.document.form1.wall2h.value; wall3_width = window.document.form1.wall3w.value; wall3_height = window.document.form1.wall3h.value; wall4_width = window.document.form1.wall4w.value; wall4_height = window.document.form1.wall4h.value; total1_area = (wall1_width * wall1_height) + (wall2_width * wall2_height) + (wall3_width * wall3_height) + (wall4_width * wall4_height); window.document.form1.total1.value = total1_area; } // --> </script> </head> <body> <form name='form1'> <table cellspacing='0'> <td> <center> <b>Walls</B><br><br> Wall 1 Width: <input type='text' name='wall1w' style="width:40px;"> ft.<br> Wall 1 Height: <input type='text' name='wall1h' style="width:40px;"> ft.<br> Wall 2 Width: <input type='text' name='wall2w' style="width:40px;"> ft.<br> Wall 2 Height: <input type='text' name='wall2h' style="width:40px;"> ft.<br> Wall 3 Width: <input type='text' name='wall3w' style="width:40px;"> ft.<br> Wall 3 Height: <input type='text' name='wall3h' style="width:40px;"> ft.<br> Wall 4 Width: <input type='text' name='wall4w' style="width:40px;"> ft.<br> Wall 4 Height: <input type='text' name='wall4h' style="width:40px;"> ft.<br><hr width='200'><br> <input type='button' value='Calculate' onClick='calculate();'><br><hr width='200'> </center> </td></tr> <tr><td> <center> <b>Total Area To Be Painted</B><br> Total Area: <input type='text' name='total1' style="width:100px;"> sq. ft.<br><hr width='200'><br> </center> </td></tr> </table> </form> </body> </html> Thanks to codingforums that help me to gain success with my javascript program! Please let me know what do you think about it: http://backslash.altervista.org/messa/mass_search.html The js script read the page http://backslash.altervista.org/messa/orari_messa.html and get the church's data and the mass's time. I know it'll better use a db but i have no control on server where the html page is (the mine is only a copy) and i want to do something that if the owner of the server want put in, it can without problem. Any review will be very appreciated Thanks ps: look at the footer pps: sorry it's all in italian Dear all, MAIN QUESTIONS : QUESTIONS for www.cyoffshore.byethost12.com/feedback4test.html I designed the Contact Us (Feedback) page of my website but something goes wrong. I would like to set an email address or some email addresses where the visitors can find me. Now, this function does not work! I would also like the users / visitors who complete and submit the (my) Contact Form, to receive an auto-confirmation to their email which will confirms that they have addressed to me with their details (their name, address, tel ,etc) according to their input into the fields and options from the (my) Contact form and if they would like to see their written request (what they have written to me if they did), they could use an option button from the (my) Contact Form. Actually the details of their written request will depend of what they would like to choose (depends on their choice). According to the submitted Contack Form, generally many users take the advantage of the Contact Us Forms where they send spam emails via the Contact Form. This might be avoid by the usage of the free tool: http://www.google.com/recaptcha Below is the url of the feedback.html page of my website. I have created a copy of the same and I renamed it to: feedback4test.html for testing purposes. www.cyoffshore.byethost12.com/feedback4test.html Here is the code: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en"> <!-- this template was designed by http://www.tristarwebdesign.co.uk - please visit for more templates & information - thank you. --> <head> <title>cyproservices</title> <!-- change to whatever you want as the title for your website --> <meta name="description" content=" " /> <!-- enter a description for your website inside the " " --> <meta name="keywords" content=" " /> <!-- enter a a string of keywords that relate to your website inside the " " --> <meta http-equiv="Content-Language" content="en-gb" /> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252" /> <link rel="stylesheet" type="text/css" href="css/style.css" /> </head> <body> <div id="headercont"> <div id="header"> <h1><span>cyproservices</span></h1> </div> </div> <div id="menucont"> <div id="menu"> <ul> <li><a title="link one" title="home" href="index.html">ABOUT CYPRUS</a></li> <li><a title="link two" href="ourservices.html">OUR SERVICES</a></li> <li><a title="link three" href="offshorejurisdictions.html">OFFSHORE JURISDICTIONS</a></li> <li><a title="link four" href="fees.html">PRICES</a></li> <li><a class="active" href="feedback.html">CONTACT US</a></li> </ul> </div> </div> <div id="maincont"> <div id="main"> <h1>Feedback</h1> <p style="margin-top: 0; margin-bottom: 0" align="justify"> <font size="3" face="Book Antiqua" color="#FF0000"> Tell me what you think about my website. I welcome all of your comments and your suggestions.</font></p> <form method="POST" action="--WEBBOT-SELF--" onSubmit="location.href='../_derived/nortbots.htm';return false;" name="SENDEMAIL" webbot-onSubmit> <!--webbot bot="SaveResults" u-file="C:\Users\antonis\Documents\My Documents\My webs\cyproservices\_private\formresults.csv" s-format="TEXT/CSV" s-label-fields="TRUE" b-reverse-chronology="FALSE" s-date-format="%d %b %Y" s-time-format="%H:%M:%S" s-builtin-fields="REMOTE_NAME REMOTE_USER HTTP_USER_AGENT Date Time" u-confirmation-url="confirm.htm" s-email-address="georgeashiotis@yahoo.com" s-email-format="TEXT/PRE" startspan --><input TYPE="hidden" NAME="VTI-GROUP" VALUE="0"><!--webbot bot="SaveResults" endspan i-checksum="43374" --><p align="justify" style="margin-top: 0; margin-bottom: 0"><strong><font color="#666666" face="Book Antiqua"> What kind of comment would you like to send?</font></strong></p> <dl> <dd> <p align="justify" style="margin-top: 0; margin-bottom: 0"><font color="#666666" face="Book Antiqua"><strong><input type="radio" name="MessageType" value="Complaint">Complaint <input type="radio" name="MessageType" value="Problem">Problem <input type="radio" checked name="MessageType" value="Suggestion">Suggestion <input type="radio" name="MessageType" value="Praise">Praise</strong></font></dd> </dl> <p align="justify" style="margin-top: 0; margin-bottom: 0"><strong><font color="#666666" face="Book Antiqua"> Subject:</font></strong></p> <blockquote> <p align="justify" style="margin-top: 0; margin-bottom: 0"><input type="text" size="26" maxlength="256" name="Subject"></p> </blockquote> <p align="justify" style="margin-top: 0; margin-bottom: 0"><strong><font color="#666666" face="Book Antiqua"> Enter your comments in the space provided below:</font></strong></p> <dl> <dd> <p align="justify" style="margin-top: 0; margin-bottom: 0"><textarea name="Comments" rows="5" cols="42"></textarea></dd> </dl> <p align="justify" style="margin-top: 0; margin-bottom: 0"><strong><font color="#666666" face="Book Antiqua"> Tell me how to get in touch with you:</font></strong></p> <dl> <dd> <table> <tr> <td> <p align="justify" style="margin-top: 0; margin-bottom: 0"><strong> <font color="#666666" face="Book Antiqua">Name:</font></strong></td> <td> <p align="justify" style="margin-top: 0; margin-bottom: 0"><input type="text" size="35" maxlength="256" name="Username"></td> </tr> <tr> <td> <p align="justify" style="margin-top: 0; margin-bottom: 0"><strong> <font color="#666666" face="Book Antiqua">E-mail:</font></strong></td> <td> <p align="justify" style="margin-top: 0; margin-bottom: 0"><input type="text" size="35" maxlength="256" name="UserEmail"></td> </tr> <tr> <td> <p align="justify" style="margin-top: 0; margin-bottom: 0"><strong> <font color="#666666" face="Book Antiqua">Tel:</font></strong></td> <td> <p align="justify" style="margin-top: 0; margin-bottom: 0"><input type="text" size="35" maxlength="256" name="UserTel"></td> </tr> <tr> <td> <p align="justify" style="margin-top: 0; margin-bottom: 0"><strong> <font color="#666666" face="Book Antiqua">Fax:</font></strong></td> <td> <p align="justify" style="margin-top: 0; margin-bottom: 0"><input type="text" size="35" maxlength="256" name="UserFAX"></td> </tr> </table> </dd> </dl> <p align="justify" style="margin-top: 0; margin-bottom: 0"> <strong><font color="#666666" face="Book Antiqua"> </font></strong><p align="justify" style="margin-top: 0; margin-bottom: 0"> <strong><font color="#666666" face="Book Antiqua"> <input type="checkbox" name="ContactRequested" value="ContactRequested"> Please contact me as soon as possible regarding this matter.</font></strong><p align="justify" style="margin-top: 0; margin-bottom: 0"> <p align="justify" style="margin-top: 0; margin-bottom: 0"><input type="submit" value="Submit Comments"> <input type="reset" value="Clear Form"></p> </form> </li> </ul> </td> </tr> </table> </div> </div> </div> <div id="footercont"> <div id="footer"> <div id="footerleft"> <p><a title="back to top" href="#headercont">^ back to top</a></p> </div> <div id="footerright"> <p>template design by <a title="derby web design" href="http://www.tristarwebdesign.co.uk">tristar web design</a></p> </div> </body> </html> </body> </html> According to the above CODE , I would like to inform you that I've just done a copy and paste to the above FORM from an other website of mine which is working properly, meaning that I do receive emailS from the users/ visitors when they fill and submit the (my) Contact Form. . This website is www.cypruspainters.net and the related web link is: http://cypruspainters.net/feedback2.htm The related CODE of the secondary website which I have copied and pasted the above code is the following CODE: : Code: <html> <head> <meta content="text/html; charset=windows-1252" http-equiv="Content-Type"> <meta content="en-us" http-equiv="Content-Language"> <title>Feedback2</title> <meta name="Microsoft Theme" content="pixel 011"> </head> <body background="_themes/pixel/pixbkgnd.gif" bgcolor="#FFFFFF" text="#000000" link="#6666CC" vlink="#999999" alink="#663333"><table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse"> <tr> <td width="49" colspan="2" align="center"> <p style="margin-top: 0; margin-bottom: 0"> <a href="http://www.agora-gallery.com/" rel="nofollow" target="_blank"> <img border="0" src="photogallery/logoForLinks2.gif" hspace="3" width="125" height="78"></a></p> </td> <td align="center" width="907"><p style="margin-top: 0; margin-bottom: 0"> <img border="0" src="HEADERS/feedback2.gif" width="621" height="60"></td> </tr> <tr> <td width="882" colspan="3" style="border-bottom-style: none; border-bottom-width: medium"> <p style="margin-top: 0; margin-bottom: 0"></td> </tr> </table><table border="0" cellpadding="0" cellspacing="0" width="100%"> <tr> <td style="border-bottom-style: solid; border-bottom-width: 1" align="right"> <h4 style="margin-top: 0; margin-bottom: 0"> </h4> </td> </tr> </table><table border="0" cellpadding="0" cellspacing="0" width="727" height="78"> <tr> <td style="border-style: none; border-width: medium" valign="top" width="140"> <p> <!--webbot b-include-home="TRUE" b-include-up="FALSE" bot="Navigation" s-orientation="vertical" s-rendering="graphics" s-theme="nature 100" s-type="siblings" --> </p> <p><br> </p> <p> </p> </td> <td style="border-style: none; border-width: medium" valign="top" width="3"> <p></p> </td> <td height="100%" style="border-style: none; border-width: medium" valign="top" width="584"> <h3 align="justify" style="margin-top: 0; margin-bottom: 0"> <font color="#FF0000" face="Book Antiqua" size="3">Tell me what you think about my website. I welcome all of your comments and your suggestions.</font></h3> <h1><b><b><b><b><b>Contact Us:</b></b></b></b></b></h1> <form action="test.mf" method="post"> Your Name:<br /> <input name="Name" size="20" type="text" value="" /><br /> <br /> Email:<br /> <input name="Email" size="20" type="text" value="" /><br /> <br /> Comments:<br /> <textarea cols="40" name="Comments" rows="10"></textarea><br /> <br /> <script src="http://api.recaptcha.net/challenge?k=6LfxMwYAAAAAAM8fEdeJUlJzGmueIL9-gDhnUdpo " type="text/javascript"></script> <noscript> <iframe frameborder="0" height="300" src="http://api.recaptcha.net/noscript?k=6LfxMwYAAAAAAM8fEdeJUlJzGmueIL9-gDhnUdpo " width="500"> </iframe><br> <textarea cols="40" name="recaptcha_challenge_field" rows="3"> </textarea> <input name="recaptcha_response_field" type="hidden" value="manual_challenge"></noscript><input type="submit" value="Submit Form" /> </form> </td> </tr> </table></td> </tr> </table></td> </tr> </table> <blockquote> </blockquote> <p> </p> <p style="margin-top: 0; margin-bottom: 0"> </p> <p style="margin-top: 0; margin-bottom: 0"> <a href="index.htm"><img align="right" border="0" height="40" src="images/Press/home3.gif" width="40"></a></p> <p style="margin-top: 0; margin-bottom: 0"> </p> <table border="0" cellpadding="0" cellspacing="0" width="746" height="0%" style="border-collapse: collapse"> <tr> <td valign="baseline" width="746"> <p align="right" style="margin-top: 0; margin-bottom: 0"> <a href="Links.htm"> <img border="0" src="images/Press/back.gif" width="47" height="29"></a><a href="feedback2.htm"><img border="0" src="images/Press/top.gif" width="40" height="29"></a></td> </tr> </table></body> </html> You can email me at: antonis20032002@yahoo.gr and I can reply to you by attaching, uploading and sending my www.cyoffshore.byethost12.com website or/ and www.cyoffshore.byethost12.com/feedback4test.html (Contact Us Form) to your email in order to investigate the case! SECONDARY QUESTIONS : ADDITIONAL QUESTIONS for www.cypruspainters.net/feedback2.htm under your consideration: Firstly, when I visit my website a pop up page appears which is very annoying for the visitors! The url of the pop up is: http://www.freelotto.com/register.as...&affiliateid=3 Another issues are : According to these issues, I have attached the screenshots and the text below: The screenshots below are refered to my previous software which was FRONTPAGE. Now I am using a substituted program which is Microsoft Expression Web 3. The problem is when I would like to use a Captcha image to block form spam and include this setting in my test.mf file (see attached screenshot -test.mf file), then @recaptchaFailPage is pointing to the page I want the visitor redirected to should they enter the wrong text from the image and does not work (see attached screenshot - recaptchaFailPage). In addition, we can add more fields to Misk Contact Us.htm Form (see attached screenshot- Misk Contact Us.htm Form) and the file test.htm is merely an example of what can be done! I created under my website a web link www.cypruspainters.net/MiskMailForm.htm with 3 images to look over the guidelines describing what is supported by my hosting provider and it will help you setup any form with their Mail Form service. Another issue, as instructed in the pdf, my hosting provider provides a Mail Form service which I can setup a confirmation page to notify people of their form being submitted successfully within the test.mf file. My confirmation page is listed as: @redirPage=confirm2.htm within the test.mf file. This is merely a redirect and will not pass Form Information to the page in order to show people what was submitted. Currently this might not be a feature of my hosting provider Mail Form service. But I am not sure! According to the attached screenshot- confirm2.htm , could you make the necessary changes to confirm2.htm in order to notify people of their form being submitted successfully with a more detailed and presentable way, for example, showing what the visitors have requested (visitors input), their details, their comments, etc and at the bottom maybe will be better if we would add a web link back to the Form! You can email me at: georgeashiotis@yahoo.com and I can reply to you by attaching, uploading and sending my www.cypruspainters.net/index.htm website or/ and www.cypruspainters.net/feedback2.htm (Contact Us Form) to your email in order to investigate the case! Thanks! Antonis I have this form I am trying to get right but I am very stuck! I have looked this up all over the Internet and the answers conflict too much, I need your expertise please. My HTML is: Code: <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>GPS-ware Order Form</title> <link href="gps.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="form.js"></script> </head> <body> <form id="orders" method="post" action="done.htm"> <div id="links"> <a href="#" class="newgroup">Home Page</a> <a href="#">Product Catalog</a> <a href="#">Order Form</a> <a href="#">Maps Online</a> <a href="#">Contact Us</a> <a href="#" class="newgroup">Countries</a> <a href="#">States</a> <a href="#">National Parks</a> <a href="#">Hiking Trails</a> <a href="#">Cities</a> <a href="#">Astronomical</a> <a href="#">Natural</a> <a href="#" class="newgroup">GoMap 1.0</a> <a href="#">Drive Planner 2.0</a> <a href="#">Hiker 1.0</a> <a href="#">G-Receiver I</a> <a href="#">G-Receiver II</a> <a href="#">G-Receiver III</a> <a href="#" class="newgroup">Downloads</a> <a href="#">Tech Support</a> <a href="#">FAQs</a> </div> <div id="main"> <p id="logo"><img src="gpsware.jpg" alt="GPS-ware" /></p> <h1>Order Form</h1> <p id="datep"> <input class="text" id="date" name="date" size="11" value="mm-dd-yyyy" tabindex="-1" readonly="readonly" /> </p> <fieldset> <legend>Enter the quantity of each item and press the Tab key</legend> <table cellspacing="2"> <tr><th class="label">Product</th><th>Price</th> <th>Quantity</th><th>Cost</th></tr> <tr> <td class="label">GoMap 1.0</td> <td><input name="price1" id="price1" size="8" value="19.95" tabindex="-1" readonly="readonly" /> </td> <td><input name="qty1" id="qty1" size="8" value="0" /> </td> <td><input name="cost1" id="cost1" size="12" value="0.00" tabindex="-1" readonly="readonly" /> </td> </tr> <tr> <td class="label">Drive Planner 2.0</td> <td><input name="price2" id="price2" size="8" value="29.95" tabindex="-1" readonly="readonly" /> </td> <td><input name="qty2" id="qty2" size="8" value="0" /> </td> <td><input name="cost2" id="cost2" size="12" value="0.00" tabindex="-1" readonly="readonly" /> </td> </tr> <tr> <td class="label">Hiker 1.0</td> <td><input name="price3" id="price3" size="8" value="29.95" tabindex="-1" readonly="readonly" /></td> <td><input name="qty3" id="qty3" size="8" value="0" /> </td> <td><input name="cost3" id="cost3" size="12" value="0.00" tabindex="-1" readonly="readonly" /> </td> </tr> <tr> <td class="label">G-Receiver I</td> <td><input name="price4" id="price4" size="8" value="149.50" tabindex="-1" readonly="readonly" /></td> <td><input name="qty4" id="qty4" size="8" value="0" /> </td> <td><input name="cost4" id="cost4" size="12" value="0.00" tabindex="-1" readonly="readonly" /> </td> </tr> <tr> <td class="label">G-Receiver II</td> <td><input name="price5" id="price5" size="8" value="199.50" tabindex="-1" readonly="readonly" /></td> <td><input name="qty5" id="qty5" size="8" value="0" /> </td> <td><input name="cost5" id="cost5" size="12" value="0.00" tabindex="-1" readonly="readonly" /> </td> </tr> <tr> <td class="label">G-Receiver III</td> <td><input name="price6" id="price6" size="8" value="249.50" tabindex="-1" readonly="readonly" /></td> <td><input name="qty6" id="qty6" size="8" value="0" /> </td> <td><input name="cost6" id="cost6" size="12" value="0.00" tabindex="-1" readonly="readonly" /> </td> </tr> <tr><td class="col4" colspan="4"> </td></tr> <tr> <td class="col3" colspan="3">Sales Tax (5%)</td> <td><input name="tax" id="tax" size="12" value="0.00" tabindex="-1" readonly="readonly" /> </td> </tr> <tr> <td class="col3" colspan="3"> <select id="shipping" name="shipping"> <option value="0">Choose a shipping option</option> <option value="4.95">Standard (4-6 business days) $4.95</option> <option value="8.95">Express (2 days) $8.95</option> <option value="12.95">Next Day (1 day) $12.95</option> </select> </td> <td><input name="shipcost" id="shipcost" value="0.00" size="12" tabindex="-1" readonly="readonly" /> </td> </tr> <tr> <td class="col3" colspan="3">TOTAL</td> <td><input name="total" id="total" size="12" value="0.00" tabindex="-1" readonly="readonly" /> </td> </tr> </table> </fieldset> <p id="pbuttons"> <input type="reset" value="Reset" /> <input type="submit" value="Submit Order" /> </p> </div> </form> </body> </html> Code: <!-- function toggle_visibility(id) { var e = document.getElementById(id); if(e.style.display == 'block') e.style.display = 'none'; else e.style.display = 'block'; } //--> </script> <img id="top" src="top.png" alt=""> <div id="form_container"> <h1><a>Test Page</a></h1> <form id="form_250840" class="appnitro" method="post" action=""> <div class="form_description"> <h2>TEST PAGE</h2> <p>QUESTIONNAIRE</p></div><ul> <div id="li_17" > <label class="description" for="element_17">Sample Question 1? </label> <input type="radio" id="element_17_yes" name="element_17" class="element radio" value="yes" onclick="document.getElementById('li_17a').style.display='block';" /> <label class="choice" for="element_17_yes">Yes</label> <input type="radio" id="element_17_no" name="element_17" class="element radio" value="no" checked="checked" onclick="document.getElementById('li_17a').style.display='none';" /> <label class="choice" for="element_17_no">No</label> </div> <div id="li_17a" > <label class="description" for="element_17a">Sample Question 2? </label> <span><input id="element_17_1a" name="element_17a" class="element radio" type="radio" value="1" /> <label class="choice" for="element_17_1a">Yes</label> <input id="element_17_2a" name="element_17a" class="element radio" type="radio" value="2" checked="checked"/> <label class="choice" for="element_17_2a">No</label></span> </div> <li class="buttons"> <input type="hidden" name="form_id" value="250840" /> <input id="saveForm" class="button_text" type="submit" name="submit" value="Submit" /> </li> </ul> Ok, my problem I seem to be having is that I want "sample question 2" to be invisible unless someone answers yes to "sample question 1". I've tried coding an onclick script into the radio buttons but I can't seem to get it working. I know this shouldn't be that difficult. Anyone know how to fix it? Hi, I have a sign-up/login form, the address is http://www.my-walk.com/signup_login.php I have arranged the elements in a table, and left the 3rd column in each table blank. When the form is submited, i want the code to display any errors with the code in these colums. E.g. If username is already used, display "Username already taken" in the 3rd colum of the username input row. Code is: [CODE] <script style="text/javascript" language="javascript"> var login = document.getElementById("login_form_table"); var signup = document.getElementById("signup_form_table"); <?php if (isset($_POST['submit_login'])) { $username = secure($_POST["username"]); $password = secure($_POST["password"]); $r = mysql_query ("SELECT * FROM members WHERE username = '".$username."'"); $num = mysql_num_rows($r); if($num == 0) { ?> alert("username not found"); login.rows[1].cells[3].innerHTML = "Username not found."; <?php } else { $row = mysql_fetch_assoc($r); if (($row["username"]==$username && ($row["password"]==$password))) { session_start(); session_register('id'); session_register('username'); $_SESSION['id'] = $row['id']; $_SESSION['username'] = $row['username']; header("Location: index.php"); } else { echo ('Username and Password do not match. Please try again </br>'); } } } if (isset($_POST['submit_signup'])) { $email = secure($_POST["email"]); $username = secure($_POST["username"]); $password = secure($_POST["password"]); $confirmpassword = secure($_POST["confirmpassword"]); $optin = secure($_POST["optin"]); if($optin=="checked") { $optin = 1; } else { $optin = 0; } $r = mysql_query ("SELECT * FROM members WHERE email = '".$email."'"); $num = mysql_num_rows($r); if(!$num == 0) { ?> alert("Email already"); signup.rows[0].cells[2].innerHTML = "A user has already signed up with this Email address."; <?php } elseif(!eregi($pattern, $email)) { ?> alert("non valid email"); signup.rows[1].cells[2].innerHTML = "Not a valid Email address!"; <?php } elseif($password != $confirmpassword) { ?> alert("password mismatch"); signup.rows[2].cells[2].innerHTML = "Passwords do not match."; signup.rows[3].cells[2].innerHTML = "Passwords do not match."; <?php } elseif(strlen($username) < 7) { ?> alert("more characters"); signup.rows[1].cells[2].innerHTML = "Username must be at least 6 letters."; <?php } elseif(strlen($password) < 7) { ?> alert("less characters"); signup.rows[2].cells[2].innerHTML = "Password mustbe at least 6 letters."; <?php } else { $r = mysql_query ("INSERT INTO members (username, email, password, optin, date) VALUES ('".$username."', '".$email."', '".$password."', '".$optin."', curdate())"); $r = mysql_query ("SELECT * FROM members WHERE email = '".$email."'"); $row = mysql_fetch_assoc($r); if($r) { session_start(); session_register('id'); session_register('username'); $_SESSION['id'] = $row['id']; $_SESSION['username'] = $row['username']; header("Location: index.php"); } else { echo 'An error occured, please attempt to sign-up again </br>'; } } } ?> </script> [CODE] as you can see there is 2 forms, and the issues a 1. None of the innerhtml parts are working. 2. I want all errors to be shown once submited, so far only 1 is dispalying at a time. I thought elseif meant it would trigger all the problems? Thanks for your help, Rick For some reason i cant get this bit of code to work. You can ignore the php and html if its getting in your way. Thanks: Code: <div id="pl"> <? if($edit == true){ ?> <script type="text/javascript"> $("#add_playlist_form").css({display:"none"}); $("#add_playlist").click(function(){ alert($("#add_playlist").html()); if($("#add_playlist").html() == "Add a Playlist >>"){ $("#add_playlist").html("Hide <<"); $("#add_playlist_form").css({display:"block"}); } else{ $("#add_playlist").html("Add a Playlist >>"); $("#add_playlist_form").css({display:"none"}); } }); </script> <a href="#" id="add_playlist">Add a Playlist >></a> <form id="add_playlist_form" method="POST" action=" "> <input type="text" name="pl_name" class="add_playlist"/> <textarea name="pl_dsec" maxlength="200"></textarea> <input type="submit" name="submit_playlist" value="Add Playlist" class="submit_playlist"/> </form> <? } ?> <ul class="vList"> Hi all, I am trying to have a form calculate total using this script, works OK until the total reaches 99 from there on it only returns 2 figures. Also it won't work if I complete the dollar value (i.e add .00) Anyone tell me where I am going wrong? Code: <script type="text/javascript"> function startCalc(){ interval = setInterval("calc()",1); } function calc(){ q1 = document.apply.appfee.value = 11; q2 = document.apply.memfee.value = 20; q3 = document.apply.levy.value; q4 = document.apply.donation.value; document.apply.total.value = (q1*1) + (q2*1) + (q3*1) + (q4*1) } function stopCalc(){ clearInterval(interval); } </script> This is the form: Code: <form name="apply" action="" method="post" onsubmit="return validate(apply)"> <table style="width:680px;"> <tr> <td style="text-align:right; white-space:nowrap; width:300px;">Application Fee:</td> <td style="text-align:left; white-space:nowrap; width:441px">$<input type="text" readonly value="" name="appfee" style="width:17px; border:0; font:11px verdana; color:#006;margin-bottom:5px;"></td> </tr> <tr> <td style="text-align:right; white-space:nowrap; width:300px;">Annual Memebership Fee:</td> <td style="text-align:left; white-space:nowrap;">$<input type="text" readonly value="" name="memfee" style="width:17px; border:0; font:11px verdana; color:#006;margin-bottom:5px;"></td> </tr> <tr> <td style="text-align:right; white-space:nowrap; width:300px;">* Optional Annual Levy:</td> <td style="text-align:left;"> $<select name="levy" onFocus="startCalc();" onBlur="stopCalc();"> <option selected>0</option> <option value="22">22</option> <option value="44">44</option> <option value="66">66</option> <option value="88">88</option> <option value="110.00">110</option> </select> </td> </tr> <tr> <td style="text-align:right; white-space:nowrap; width:300px;">* Optional Donation:</td> <td>$<input type="text" name="donation" value="" onFocus="startCalc();" onBlur="stopCalc();" style="font:11px verdana; color:#006;margin-bottom:5px; width:80px;"></td> </tr> <tr> <td style="text-align:right; white-space:nowrap; width:300px;"><b>TOTAL:</b></td> <td white-space:nowrap;><b>$<input type="text" name="total" style="width:17px; border:0; font:bold 11px verdana; color:#006;margin-bottom:6px;"></b></td> </tr> </table> </form> Hi, I'm trying to automatically generate a new <option> tag in a html form using the below code, but it's not working. Does anyone have any ideas? The get_lightboxes function is being called via the add_to_lightbox functon. Javascript: function get_lightboxes(title, new_lightbox_id){ var new_option = document.createElement('option'); new_option.text = title; new_option.value = new_lightbox_id; var select_box = document.getElementByID('lightbox_select'); try { select_box.add(new_option, null); } catch(ex) { select_box.add(new_option); } } HTML: <form method="post" action="<?=$_SERVER['PHP_SELF']?>" name="lightbox_form" onsubmit="add_to_lightbox('<?=$_GET['id']?>', '<?=$_GET['media_urn']?>', lightbox_select_<?=$_GET['id']?>.value); return false;"> <input type="hidden" name="submitted" value="1" /> <input type="hidden" name="user_email_<?=$_GET['id']?>" value="<?=$_GET['user_email']?>" /> <input type="hidden" name="record_id_<?=$_GET['id']?>" value="<?=$_GET['id']?>" /> <input type="hidden" name="media_urn_<?=$_GET['id']?>" value="<?=$_GET['media_urn']?>" /> <h2>Add/Delete from existing lightbox:</h2> <p> <select name="lightbox_select_<?=$_GET['id']?>" id="lightbox_select"> <? foreach ($get_lightboxes as $lightbox) : ?> <? $lightbox_id = $lightbox["lightbox_id"]; ?> <? $title = $lightbox["title"]; ?> <? if(strlen($title) > 25) $title = substr($title, 0, 25) . "…"; ?> <option value="<?=$lightbox_id?>"><?=$title?></option> <? endforeach; ?> </select> <input type="submit" name="submit" value="Add" /> </p> </form> Hi everyone, The following code has an onblur event in the input fields so that if someone clicks out of the field without typing something in it, the original label, ie. 'First name' is reinserted into the field. The field is also being validated by some php code, however the onblur event creates a problem because the form still submits even if a name isn't typed into the field. It's assuming that 'First name' is an entry and therefore isn't validating it correctly. It was suggested that on the submit event of the form, there would be a function that checks if the value is First Name then return false, but then otherwise return true. As my javascript skills are very basic, I wondered if someone could help me with this code to solve this issue? Appreciate any help. Code: <input id="firstname" name="firstname" type="text" value="First name" onfocus="if (this.value == 'First name') this.value=''" onblur="if (this.value == '') this.value='First name'" /> <?php if (ValidatedField('index_965','index_965')) { if ((strpos((",".ValidatedField("index_965","index_965").","), "," . "1" . ",") !== false || "1" == "")) { if (!(false)) { ?> <span style="color: red"> First name is required </span> <?php //WAFV_Conditional index.php index_965(1:) } } }?> 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] Greetings! I'm trying to disable some form elements using the onclick from a radio input element. It ain't working so great! I googled around and finally scraped together some code that in theory 'I' think should work. I'm no javascript guru! It has to be some tiny tiny thing I'm missing. Here's my code and mind you this is a project in the making! I still have along way to go! Thanks for you time and help! 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" xml:lang="en"> <head> <title>Empty Page</title> <script type='text/javascript'> function setReadOnly(obj) { if(obj.value == "1") { document.shiftreport.artprogs.disabled = true; document.shiftreport.artprog_stat.disabled = true; } else { document.shiftreport.icprogs.disabled = true; document.shiftreport.icprog_stat.disabled = true; } } </script> </head> <body> <?php include_once('form_input_functions.php'); $artprog_status = array('none' => 'None', 'stopped' => 'Stopped', 'running' => 'Running', 'completed' => 'Completed', ); $artprog_wfls = array('no_job' => '------- select a job -------', 'ARTPROG/WFL/DAILY/BATCH' => 'ARTPROG/WFL/DAILY/BATCH', 'ARTPROG/WFL/OPERATIONS/IMAGE' => 'ARTPROG/WFL/OPERATIONS/IMAGE', 'ARTPROG/WFL/WKLY/BATCH' => 'ARTPROG/WFL/WKLY/BATCH', 'ARTPROG/WFL/DAILY/CLAIMS' => 'ARTPROG/WFL/DAILY/CLAIMS' ); $bllyprog_status = array('none' => 'None', 'stopped' => 'Stopped', 'running' => 'Running', 'completed' => 'Completed', ); $bllyprog_wfls = array('no_job' => '------- select a job -------', 'BLLYPROG/WFL/DAILY/SISCHEDPAY' => 'BLLYPROG/WFL/DAILY/SISCHEDPAY', 'BLLYPROG/WFL/DAILY/REPORTS' => 'BLLYPROG/WFL/DAILY/REPORTS', 'BLLYPROG/WFL/WKLY/REPORTS/GYPSUM' => 'BLLYPROG/WFL/WKLY/REPORTS/GYPSUM', '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP' => '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP', '$UTIL/O/AUDIT/CLOSE/BLLY' => '$UTIL/O/AUDIT/CLOSE/BLLY', 'DATASIWH/EXTRACTALL/DAILY/AUD/WFL' => 'DATASIWH/EXTRACTALL/DAILY/AUD/WFL', ); $sbwcprog_status = array('none' => 'None', 'stopped' => 'Stopped', 'running' => 'Running', 'completed' => 'Completed', ); $sbwcprog_wfls = array('no_job' => '------- select a job -------', 'WORKPROG/WFL/DAILY/WAREHOUSE' => 'WORKPROG/WFL/DAILY/WAREHOUSE', '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP' => '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP', '$UTIL/O/AUDIT/CLOSE/WORKCOMP' => '$UTIL/O/AUDIT/CLOSE/WORKCOMP' ); $tcsprog_status = array('none' => 'None', 'stopped' => 'Stopped', 'running' => 'Running', 'completed' => 'Completed', ); $tcsprog_wfls = array ('no_job' => '------- select a job -------', 'TCS/WFL/DAILY/BATCH' => 'TCS/WFL/DAILY/BATCH', 'BLPROG/WFL/COPY/REMOVE/GLCHECKS' => 'BLPROG/WFL/COPY/REMOVE/GLCHECKS' ); $icprog_status = array('none' => 'None', 'stopped' => 'Stopped', 'running' => 'Running', 'completed' => 'Completed', ); $icprog_wfls = array ('no_job' => '------- select a job -------', 'BLPROG/WFL/DAILY/INDCONT' => 'BLPROG/WFL/DAILY/INDCONT', 'INDCON/WFL/PRINT/IDCARDS' => 'INDCON/WFL/PRINT/IDCARDS', 'BLPROG/WFL/BATCH/NEWYORK/STATE-REPORT' => 'BLPROG/WFL/BATCH/NEWYORK/STATE-REPORT' ); $truckprog_status = array('none' => 'None', 'stopped' => 'Stopped', 'running' => 'Running', 'completed' => 'Completed', ); $truckprog_wfls = array('no_job' => '------- select a job -------', 'TRUCKPROG/WFL/DAILY/TKINTMARSH' => 'TRUCKPROG/WFL/DAILY/TKINTMARSH', 'TRUCKPROG/WFL/DAILY/TKINTERNET' => 'TRUCKPROG/WFL/DAILY/TKINTERNET', 'TRUCKPROG/WFL/DAILY/BATCH' => 'TRUCKPROG/WFL/DAILY/BATCH', 'TRUCKPROG/WFL/DAILY/TKSCHEDPAY' => 'TRUCKPROG/WFL/DAILY/TKSCHEDPAY', 'TRUCKPROG/WFL/DAILY/REPORTS' => 'TRUCKPROG/WFL/DAILY/REPORTS', 'BLPROG/WFL/DAILY/CLAIMS' => 'BLPROG/WFL/DAILY/CLAIMS', 'TRUCKPROG/WFL/DAILY/AUDIT/PREMIUM' => 'TRUCKPROG/WFL/DAILY/AUDIT/PREMIUM', 'TRUCKPROG/WFL/DAILY/BALRPT' => 'TRUCKPROG/WFL/DAILY/BALRPT', 'PROG-MEDICAL/WFL/DAILY/PMCLMEXT' => 'PROG-MEDICAL/WFL/DAILY/PMCLMEXT', 'AGPROG/WFL/DAILY/AGNUCOPREM' => 'AGPROG/WFL/DAILY/AGNUCOPREM', 'BL/WFL/WKLY/FEDEX/0005' => 'BL/WFL/WKLY/FEDEX/0005', 'TRUCKPROG/WFL/WKLY/DE542' => 'TRUCKPROG/WFL/WKLY/DE542', 'TRUCKPROG/WFL/WKLY/FDXDISAB' => 'TRUCKPROG/WFL/WKLY/FDXDISAB', 'TRUCKPROG/WFL/WKLY/FDXDISERR' => 'TRUCKPROG/WFL/WKLY/FDXDISERR', 'BL/WFL/ONLINE/DUMP/TRUCKING' => 'BL/WFL/ONLINE/DUMP/TRUCKING', 'DATATKWH/EXTRACTALL/DAILY/WFL' => 'DATATKWH/EXTRACTALL/DAILY/WFL', '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP' => '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP' ); $smallprog_status = array('none' => 'None', 'stopped' => 'Stopped', 'running' => 'Running', 'completed' => 'Completed', ); $smallprog_wfls = array('no_job' => '------- select a job -------', 'SMALLPROG/WFL/DAILY/BATCH' => 'SMALLPROG/WFL/DAILY/BATCH', 'SMALLPROG/WFL/DAILY/CERTS' => 'SMALLPROG/WFL/DAILY/CERTS', 'SMALLPROG/WFL/OPERATIONS/PRINT' => 'SMALLPROG/WFL/OPERATIONS/PRINT', 'SMALLPROG/WFL/WKLY/BATCH' => 'SMALLPROG/WFL/WKLY/BATCH', 'SFCLAIMS/WFL/DAILY/DWHCLAIMS' => 'SFCLAIMS/WFL/DAILY/DWHCLAIMS', 'SFCLAIMS/WFL/DAILY/REPORTS' => 'SFCLAIMS/WFL/DAILY/REPORTS', 'SFCLAIMS/WFL/WEEKLY/REPORTS' => 'SFCLAIMS/WFL/WEEKLY/REPORTS', 'BL/WFL/ONLINE/DUMP/SFDB/1WORKER' => 'BL/WFL/ONLINE/DUMP/SFDB/1WORKER', '$UTIL/O/AUDIT/CLOSE/SFDB' => '$UTIL/O/AUDIT/CLOSE/SFDB', 'DATASFWH/EXTRACTALL/DAILY/WFL' => 'DATASFWH/EXTRACTALL/DAILY/WFL', '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP' => '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP' ); $persauto_status = array('none' => 'None', 'stopped' => 'Stopped', 'running' => 'Running', 'completed' => 'Completed', ); $persauto_wfls = array('no_job' => '------- select a job -------', 'PERSAUTO/WFL/DAILY/BATCH' => 'PERSAUTO/WFL/DAILY/BATCH', 'PERSAUTO/WFL/OPERATIONS/IMAGE' => 'PERSAUTO/WFL/OPERATIONS/IMAGE', 'PERSAUTO/WFL/OPERATIONS/PRINT' => 'PERSAUTO/WFL/OPERATIONS/PRINT', 'PERSAUTO/WFL/WKLY/BATCH' => 'PERSAUTO/WFL/WKLY/BATCH', 'PERSAUTO/WFL/DAILY/CLAIMS' => 'PERSAUTO/WFL/DAILY/CLAIMS', 'BL/WFL/ONLINE/DUMP/DB1/1WORKER/FULL' => 'BL/WFL/ONLINE/DUMP/DB1/1WORKER/FULL', '$UTIL/O/AUDIT/CLOSE/DB1' => '$UTIL/O/AUDIT/CLOSE/DB1', 'DATAWH/EXTRACTALL/DAILY/WFL' => 'DATAWH/EXTRACTALL/DAILY/WFL', 'BL/WFL/OFFLINE/DUMP/WAREHOUSE' => 'BL/WFL/OFFLINE/DUMP/WAREHOUSE' ); $isoprog_status = array('none' => 'None', 'stopped' => 'Stopped', 'running' => 'Running', 'completed' => 'Completed', ); $isoprog_wfls = array('no_job' => '------- select a job -------', 'ISOPROG/WFL/BATCH/ISOSAGDAILY' => 'ISOPROG/WFL/BATCH/ISOSAGDAILY' ); $bkuplive_status = array('none' => 'None', 'stopped' => 'Stopped', 'running' => 'Running', 'completed' => 'Completed', ); $bkuplive_wfls = array('no_job' => '------- select a job -------', 'BL/WFL/ONLINE/DUMP/BLDB' => 'BL/WFL/ONLINE/DUMP/BLDB', '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP' => '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP', '$UTIL/O/AUDIT/CLOSE/BLDB' => '$UTIL/O/AUDIT/CLOSE/BLDB', 'DATARDWH/EXTRACTALL/DAILY/REIN/WFL' => 'DATARDWH/EXTRACTALL/DAILY/REIN/WFL', '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP' => '(BLPACK)BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP', 'BL/WFL/FICHE/DISK' => 'BL/WFL/FICHE/DISK' ); $testsite_status = array('none' => 'None', 'stopped' => 'Stopped', 'running' => 'Running', 'completed' => 'Completed', ); $testsite_wfls = array('no_job' => '------- select a job -------', 'WFL/TESTLYON/DATABASE/ONLINE/DISABLE' => 'WFL/TESTLYON/DATABASE/ONLINE/DISABLE', 'UTIL/WFL/REMOVE/TESTLYON/BDFILES' => 'UTIL/WFL/REMOVE/TESTLYON/BDFILES', 'BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP' => 'BALDLYON/WFL/BLPACK/ARCHIVEANDBACKUP' ); ?> <form method="POST" name="shiftreport" action="<?php print $_SERVER['PHP_SELF']; ?>"> <p>1st Shift <?php input_radiocheck('radio','shift','0','1','1'); ?></p> <p>2st Shift <?php input_radiocheck('radio','shift','0','2','1'); ?></p> <p>3st Shift <?php input_radiocheck('radio','shift','0','3','1'); ?></p> <table> <thead> <tr> <th>Application</th> <th>Job Stream</th> <th>Status</th> </tr> </thead> <tbody> <tr> <td>ARTISAN</td> <td> <?php input_select('artprogs',$artprog_wfls['no_job'], $GLOBALS['artprog_wfls'], '390px'); ?> </td> <td> <?php input_select('artprog_stat', $artprog_status['none'] , $GLOBALS['artprog_status']); ?> </td> </tr> <tr> <td>SELF INSURED</td> <td> <?php input_select('bllyprogs',$bllyprog_wfls['no_job'], $GLOBALS['bllyprog_wfls'], '390px'); ?> </td> <td> <?php input_select('bllyprog_stat', $bllyprog_status['none'] , $GLOBALS['bllyprog_status']); ?> </td> </tr> <tr> <td>SBWC</td> <td> <?php input_select('sbwcprogs',$sbwcprog_wfls['no_job'],$GLOBALS['sbwcprog_wfls'], '390px'); ?> </td> <td> <?php input_select('sbwcprog_stat', $sbwcprog_status['none'] , $GLOBALS['sbwcprog_status']); ?> </td> </tr> <tr> <td>TCS</td> <td> <?php input_select('tcsprogs',$tcsprog_wfls['no_job'], $GLOBALS['tcsprog_wfls'], '390px'); ?> </td> <td> <?php input_select('tcsprog_stat', $tcsprog_status['none'] , $GLOBALS['tcsprog_status']); ?> </td> </tr> <tr> <td>IC</td> <td> <?php input_select('icprogs',$icprog_wfls['no_job'], $GLOBALS['icprog_wfls'], '390px'); ?> </td> <td> <?php input_select('icprog_stat', $icprog_status['none'] , $GLOBALS['icprog_status']); ?> </td> </tr> <tr> <td>TRUCKING</td> <td> <?php input_select('truckprogs',$truckprog_wfls['no_job'], $GLOBALS['truckprog_wfls'], '390px'); ?> </td> <td> <?php input_select('truckprog_stat', $truckprog_status['none'] , $GLOBALS['truckprog_status']); ?> </td> </tr> <tr> <td>SMALL FLEET</td> <td> <?php input_select('smallprogs',$smallprog_wfls['no_job'], $GLOBALS['smallprog_wfls'], '390px'); ?> </td> <td> <?php input_select('smallprog_stat', $smallprog_status['none'] , $GLOBALS['smallprog_status']); ?> </td> </tr> <tr> <td>PERSONAL AUTO</td> <td> <?php input_select('persauto',$persauto_wfls['no_job'], $GLOBALS['persauto_wfls'], '390px'); ?> </td> <td> <?php input_select('persauto_stat', $persauto_status['none'] , $GLOBALS['persauto_status']); ?> </td> </tr> <tr> <td>ISO</td> <td> <?php input_select('isoprog',$isoprog_wfls['no_job'], $GLOBALS['isoprog_wfls'], '390px'); ?> </td> <td> <?php input_select('isoprog_stat', $isoprog_status['none'] , $GLOBALS['isoprog_status']); ?> </td> </tr> <tr> <td>BACKUPS LIVE</td> <td> <?php input_select('bkuplive',$bkuplive_wfls['no_job'], $GLOBALS['bkuplive_wfls'], '390px'); ?> </td> <td> <?php input_select('bkuplive_stat', $bkuplive_status['none'] , $GLOBALS['bkuplive_status']); ?> </td> </tr> <tr> <td>TEST SITE INSTRUCTIONS</td> <td> <?php input_select('testsite',$testsite_wfls['no_job'], $GLOBALS['testsite_wfls'], '390px'); ?> </td> <td> <?php input_select('testsite_stat', $testsite_status['none'] , $GLOBALS['testsite_status']); ?> </td> </tr> </tbody> </table> </form> </body> </html> The included functions file that I didn't include is below: Code: <?php function input_text($element_name, $value) { print '<input type="text" name="' . $element_name . '" value="'; print htmlentities($values[$element_name]) . '">'; } function input_submit($element_name,$label) { print '<input type="submit" name="' . $element_name .'" value="'; print htmlentities($label) .'"/>'; } function input_textarea($element_name,$values) { print '<textarea name="' . $element_name . '">'; print htmlentities($values[$element_name]) . '</textarea>'; } function input_radiocheck($type,$element_name,$values,$element_value,$clicker = '0') { print '<input type="' . $type . '" name="' . $element_name . '" value="' . $element_value . '" '; if ($element_value == $values[$element_name]) { print ' checked="checked"'; } if ($clicker == '1') print ' onclick="setReadOnly(this)"'; print '/>'; } function input_select($element_name, $selected, $options, $drop_width = '100px', $multiple = false) { print '<select style="width:' . $drop_width . ';" name="' . $element_name; if ($multiple) { print '[]" multiple="multiple'; } print '">'; $selected_options = array(); if ($multiple) { foreach ($selected[$element_name] as $val) { $selected_options[$val] = true; } } else { $selected_options[ $selected[$element_name] ] = true; } foreach ($options as $option => $label) { print '<option value="' . htmlentities($option) . '"'; if (isset($selected_options[$option])) { print ' selected="selected"'; } print '>' . htmlentities($label) . '</option>'; } print '</select>'; } ?> 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've literally tried everything. Read 26 tutorials, interchanged code, etc. My validation functions all work. My AJAX functions work (tested manually using servlet URL's). The second servlet validates the reCaptcha form that's generated on my webpage. After the form is validated, even if everything's correct, nothing happens upon clicking submit. I even have an alert pop up if with the captcha result, just for middle-layer debugging purposes. I want to do all of my validation clientside; none serverside. However, going to be tough if I can't get my god damn form to submit. I've been puzzled by this for close to 36 hours straight. I can't see, and I'm going to get some rest and hope that there is some useful insight on my problem when I return. html form: Code: <form id="f1" name="form1" onsubmit="validate_form(this); return false;" action="register" method="post"> <table cellspacing="5" style="border: 2px solid black;"> <tr> <td valign="top"> <table cellspacing="5"> <tr> <td>*First name</td> <td align="right"><span id="valid_one"></span></td> <td><input type="text" style="width: 320px;" id="fn" name="fn" onBlur="validate_one();"></td> </tr> <tr> <td align="left">*Last name</td> <td align="right"><span id="valid_two"></span></td> <td><input type="text" style="width: 320px;" id="ln" name="ln" onBlur="validate_two();"></td> </tr> <tr> <td align="left">*Email address</td> <td align="right"><span id="result"></span></td> <td><input type="text" style="width: 320px;" id="mailfield" name="email" onBlur="startRequest();"></td> </tr> <tr> <td align="left">*Phone number</td> <td align="right"><span id="valid_three"></span></td> <td><input type="text" style="width: 320px;" id="pn" name="pn" onBlur="validate_three();"></td> </tr> <tr> <td align="left">*City/Town</td> <td align="right"><span id="valid_four"></span></td> <td><input type="text" style="width: 320px;" id="c" name="c" onBlur="validate_four();"></td> </tr> <tr> <td></td> <td></td> <td> <select name="s"> <option value="AL">Alabama <option value="AK">Alaska <option value="AZ">Arizona <option value="AR">Arkansas <option value="CA">California <option value="CO">Colorado <option value="CT">Connecticut <option value="DE">Delaware <option value="FL">Florida <option value="GA">Georgia <option value="HI">Hawaii <option value="ID">Idaho <option value="IL">Illinois <option value="IN">Indiana <option value="IA">Iowa <option value="KS">Kansas <option value="KY">Kentucky <option value="LA">Louisiana <option value="ME">Maine <option value="MD">Maryland <option value="MA">Massachusetts <option value="MI">Michigan <option value="MN">Minnesota <option value="MS">Mississippi <option value="MO">Missouri <option value="MT">Montana <option value="NE">Nebraska <option value="NV">Nevada <option value="NH">New Hampshire <option value="NJ">New Jersey <option value="NM">New Mexico <option value="NY">New York <option value="MC">North Carolina <option value="ND">North Dakota <option value="OH">Ohio <option value="OK">Oklahoma <option value="OR">Oregon <option value="PA">Pennsylvania <option value="RI">Rhode Island <option value="SC">South Carolina <option value="SD">South Dakota <option value="TN">Tennessee <option value="TX">Texas <option value="UT">Utah <option value="VT">Vermont <option value="VA">Virginia <option value="WA">Washington <option value="WV">West Virginia <option value="WI">Wisconsin <option value="WY">Wyoming </select> </td> </tr> <tr> <td> <br> </td> </tr> <tr> <td></td> <td></td> <td><span id="error"></span></td> </tr> <tr> <td valign="top">*Anti-Spam Verification</td> <td></td> <td id="reCaptcha"></td> </tr> </table> </td> <td valign="top"> <table cellspacing="5"> <tr> <td align="left">*Affiliation</td> <td align="right"><span id="valid_five"></span></td> <td><input type="text" style="width: 320px;" id="affl" name="affl" onBlur="validate_five();"></td> </tr> <tr> <td align="left">*Research Area:</td> <td align="right"><span id="valid_six"></span></td> <td><input type="text" style="width: 320px;" id="ra" name="ra" onBlur="validate_six();"></td> </tr> <tr> <td valign="top" align="left">*Research Overview</td> <td align="right"><span id="valid_seven"></span></td> <td><textarea cols="38" rows="6" id="ro" name="ro" onKeyDown="limitText(this.form.ro,this.form.countdown,500)" onKeyUp="limitText(this.form.ro,this.form.countdown,500)" onBlur="validate_seven();"></textarea></td> </tr> <tr> <td></td> <td></td> <td><font size="1">You have <input readonly type="text" name="countdown" size="1" value="500"> characters remaining.</font></td> </tr> <tr> <td align="left">*Talk Availability</td> <td></td> <td> <input type="radio" name="ta" value="In person">In person <input type="radio" name="ta" value="Online">Online <input type="radio" name="ta" value="Both" checked>Both </td> </tr> <tr> <td align="left" valign="top">Links</td> <td></td> <td> <table id="linkTable" border="0"> <td><input type="text" style="width: 320px;" name="link"></td> <td><div id="result"></div></td> </table> </td> <td align="left" valign="top"><input type="button" value="Add Link" onclick="addLink('linkTable')"></td> </tr> <tr> <td></td> <td><span style="color: red;"></span></td> </tr> </table> </td> </tr> </table> <br /> <input type="submit" id="submit" name="submit" value="Submit Form"> </form> Javascript file: Code: /* * script.js - ajax and table functions */ var xmlHttp; // global instance of XMLHttpRequest var xmlHttp2; // second for captcha functions var validAjax = new Boolean(); var validCaptcha = new Boolean(); var valid_one = new Boolean(); var valid_two = new Boolean(); var valid_three = new Boolean(); var valid_four = new Boolean(); var valid_five = new Boolean(); var valid_six = new Boolean(); var valid_seven = new Boolean(); function init() { showRecaptcha('reCaptcha'); // Separate booleans for AJAX funcs validAjax = false; validCaptcha = false; // Booleanse for fields that don't require servlet validation valid_one = false; valid_two = false; valid_three = false; valid_four = false; valid_five = false; valid_six = false; valid_seven = false; } function showRecaptcha(element) { Recaptcha.create("6Le1a8ESAAAAAGtxX0miZ2bMg0Wymltnth7IG-Mj", element, {theme: "red", callback: Recaptcha.focus_response_field}); } function validate_form() { if (valid_one && valid_two && valid_three && valid_four && validEmail) { startCaptchaRequest(); if (validCaptcha) { return true; } } else { alert("Submission contains errors. Please fill out all required fields before submitting."); return false; } } function validate_one() { if (document.getElementById("fn").value == 0) { valid_one = false; document.getElementById("valid_one").innerHTML = "No"; } else { valid_one = true; document.getElementById("valid_one").innerHTML = ""; } } function validate_two() { if (document.getElementById("ln").value == 0) { valid_two = false; document.getElementById("valid_two").innerHTML = "No"; } else { valid_two = true; document.getElementById("valid_two").innerHTML = ""; } } function validate_three() { if (document.getElementById("pn").value == 0) { valid_three = false; document.getElementById("valid_three").innerHTML = "No"; } else { valid_three = true; document.getElementById("valid_three").innerHTML = ""; } } function validate_four() { if (document.getElementById("c").value == 0) { valid_four = false; document.getElementById("valid_four").innerHTML = "No"; } else { valid_four = true; document.getElementById("valid_four").innerHTML = ""; } } function validate_five() { if (document.getElementById("affl").value == 0) { valid_five = false; document.getElementById("valid_five").innerHTML = "No"; } else { valid_five = true; document.getElementById("valid_five").innerHTML = ""; } } // //function validate_six() { // if (document.getElementById("ra").value == 0) { // valid_six = false; // document.getElementById("valid_six").innerHTML = "No"; // } // else { // valid_six = true; // document.getElementById("valid_six").innerHTML = ""; // } //} // //function validate_seven() { // if (document.getElementById("ro").value == 0) { // valid_seven = false; // document.getElementById("valid_seven").innerHTML = "No"; // } // else { // valid_seven = true; // document.getElementById("valid_seven").innerHTML = ""; // } //} function addLink(tableID) { var table = document.getElementById(tableID); var rowCount = table.rows.length; var row = table.insertRow(rowCount); var cell = row.insertCell(0); var element1 = document.createElement("input"); element1.type = "text"; element1.name = "link" + rowCount; element1.style.width = "320px"; cell.appendChild(element1); } function limitText(limitField, limitCount, limitNum) { if (limitField.value.length > limitNum) { limitField.value = limitField.value.substring(0, limitNum); } else { limitCount.value = limitNum - limitField.value.length; } } function createXmlHttpRequest() { if(window.ActiveXObject) { xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } else if(window.XMLHttpRequest) { xmlHttp=new XMLHttpRequest(); } } function startRequest() { createXmlHttpRequest(); var param1 = document.getElementById('mailfield').value; if (param1 == "") { validEmail = false; document.getElementById("result").innerHTML = "Blank"; } else { xmlHttp.open("GET", "http://localhost:1979/PolarSpeakers/servlet/mailCheck.do?e=" + param1, true) xmlHttp.onreadystatechange = handleStateChange; xmlHttp.send(null); } } function handleStateChange() { if(xmlHttp.readyState==4) { if(xmlHttp.status==200) { var message = xmlHttp.responseXML .getElementsByTagName("valid")[0] .childNodes[0].nodeValue; if (message == "Unregistered") { validEmail = true; document.getElementById("result").style.color = "green"; } else { validEmail = false; document.getElementById("result").style.color = "red"; } document.getElementById("result").innerHTML = message; } else { alert("Error checking e-mail address - " + xmlHttp.status + " : " + xmlHttp.statusText); } } } function createCaptchaRequest() { if(window.ActiveXObject) { xmlHttp2=new ActiveXObject("Microsoft.XMLHTTP"); } else if(window.XMLHttpRequest) { xmlHttp2=new XMLHttpRequest(); } } function startCaptchaRequest() { alert('made it to captcha requeswt'); createCaptchaRequest(); var param1 = Recaptcha.get_challenge(); var param2 = Recaptcha.get_response(); xmlHttp2.open("POST", "http://localhost:1979/PolarSpeakers/servlet/captchaCheck.do?c=" + param1 + "&r=" + param2, true) xmlHttp2.onreadystatechange = handleStateChangeCaptcha; xmlHttp2.send(null); } function handleStateChangeCaptcha() { if(xmlHttp2.readyState==4) { if(xmlHttp2.status==200) { var message = xmlHttp2.responseXML .getElementsByTagName("result")[0] .childNodes[0].nodeValue; if (message == "Valid") { alert("captcha valid"); validCaptcha = true; } else { document.getElementById("error").innerHTML = message; validCaptcha = false; } } else { alert("Error checking captcha validity - " + xmlHttp2.status + " : " + xmlHttp2.statusText); } } } Hi guys, Been stuck for a few days with this scenario. Any help? The alert box appears on an error. But the submitting won't stop. The details are submitted and the form is processed. Any help is greatly appreciated... Code: <html> <head> <script type="text/javascript" src="email_helper/jscripts/tiny_mce/tiny_mce.js"></script> <script type="text/javascript"> tinyMCE.init({ // General options mode : "textareas", theme : "simple" }); </script> <script language="javascript"> function MM_openBrWindow(theURL,winName,features) { window.open(theURL,winName,features); } function err_check(){ var email = document.getElementById('to_email').value; if(email.length==0){ alert('Please Enter Email Address'); return false; } var AtPos = email.indexOf("@") var StopPos = email.lastIndexOf(".") if (AtPos == -1 || StopPos == -1) { alert("Please Enter Valid Email Address"); document.getElementById('email').focus(); return false; } email = document.getElementById('cc_email').value; if(email.length != 0){ var AtPos = email.indexOf("@") var StopPos = email.lastIndexOf(".") if (AtPos == -1 || StopPos == -1) { alert("Please Enter Valid Email Address"); document.getElementById('email').focus(); return false; } } var answer = confirm ("Send E-Mail?"); if (!answer){ return false; } } </script> <!-- /TinyMCE --> <style type="text/css"> body, table, td, th{ background-color:#CCCCCC; font-family: Arial; font-size:14px; } .que{ font-weight:bold; } </style> </head> <body> <form method="post" enctype="multipart/form-data"> <?php include 'library/database.php'; include 'library/opendb.php'; $query = mysql_query("SELECT email,contact,mobile FROM users WHERE user_id='$uid'") or die(mysql_error()); $row = mysql_fetch_row($query); $from_email = $row[0]; $from_person = $row[1]; $from_mobile = $row[2]; $query = mysql_query("SELECT customer_id FROM campaign_summary WHERE camp_id='$camp_id'") or die(mysql_error()); $row = mysql_fetch_row($query); $cusid = $row[0]; $query = mysql_query("SELECT email FROM client_info WHERE comp_id='$cusid'") or die(mysql_error()); $row = mysql_fetch_row($query); $toer = $row[0]; include 'library/closedb.php'; ?> <table width="100%" border="0"> <tr><td rowspan="4"><input type="submit" name="send_email" id="send_email" style="height:50px; width:100px;" value="SEND" onClick="return err_check();" /></td><td><span class="que">From : </span></td><td colspan="3"><?php echo $from_email; ?><input type="hidden" name="from_mail" id="from_mail" /><input type="hidden" name="camp_id" id="camp_id" value="<?php echo $camp_id;?>"/></td></tr> <tr><td><span class="que">To : </span></td><td colspan="3"><input name="to_email" id="to_email" style="width:250px;" value="<?php echo $toer;?>"/></td></tr> <tr><td><span class="que">CC : </span></td><td colspan="3"><input name="cc_email" id="cc_email" style="width:250px;"/></td></tr> <tr><td><span class="que">Subject : </span></td><td colspan="3"><input style="width:300px;" name="subject" id="subject" /></td></tr> <tr><td rowspan="1" colspan="2"> </td><td><input type="checkbox" name="ori_pdf" id="ori_pdf" checked /> PDF Quotation</td><td> </td><td> </td></tr><tr><td colspan="2"><span class="que">Credit Application</span></td><td><input type="checkbox" name="corporate" id="corporate"/>Corporate</td><td><input type="checkbox" name="individual" id="individual" />Individual</td><td><input type="checkbox" name="cash" id="cash" />Cash Account</td> </tr> <tr> <td colspan="2" rowspan="3"></td><td><input type="checkbox" name="tabloid" id="tabloid" />Tabloid Example</td> <td><input type="checkbox" name="broadsheet" id="broadsheet" />Broadsheet Example</td></tr> <tr><td><input type="checkbox" name="colmt" id="colmt" />Column Sizes Tabloid</td> <td><input type="checkbox" name="colmb" id="colmb" />Column Sizes Broadsheet</td></tr> <tr><td><input type="checkbox" name="maps" id="maps" />Maps / Distribution</td><td colspan="2" align="right">External Attachments <input id="upload_file" name="upload_file" type="file"/> </td></tr> <tr><td colspan="2"><span class="que">Message :</span></td><td colspan="3"> <textarea id="elm1" name="elm1" rows="15" cols="80" style="width: 100%"> <?php echo "<br><br><br>" . $from_person . "<br>" . $from_mobile; ?> </textarea> </td></tr> </table> </form> </body> </html> Hello all, I have a multistep jquery form that validates user input and then should send me an email. Problem is, right now, I can only get it to validate the first page, then it sends the email before the rest of the pages are viewed. I'm just trying to delay the submission of the form until the "submit_fourth" button is pressed. I've got $25 via paypal for the one who sticks with this one for long enough to come up with a workable solution. Here is my code... I know it's a lot, but I wasn't sure how much would be helpful. HTML code is in the second post in this thread (it was just too much to fit in one go). Cheers! -Dave The Javascript: Code: $(function validateForm(){ //original field values var field_values = { //id : value 'name' : 'your name', 'email' : 'email', 'phone' : '(555) 123-4567', 'other' : 'other', 'detail' : 'project overview' }; //inputfocus $('input#name').inputfocus({ value: field_values['name'] }); $('input#email').inputfocus({ value: field_values['email'] }); $('input#phone').inputfocus({ value: field_values['phone'] }); $('input#other').inputfocus({ value: field_values['other'] }); $('input#detail').inputfocus({ value: field_values['detail'] }); //reset progress bar $('#progress').css('width','0'); $('#progress_text').html('0% Complete'); //first_step $('form').submit(function(){ }); $('#submit_first').click(function(){ //remove classes $('#first_step input').removeClass('error').removeClass('valid'); //ckeck if inputs aren't empty var emailPattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/; var fields1 = $('#first_step input[type=text]'); var error = 0; fields1.each(function(){ var value = $(this).val(); if( value.length<5 || value==field_values[$(this).attr('id')] || ( $(this).attr('id')=='email' && !emailPattern.test(value) ) ) { $(this).addClass('error'); $(this).effect("shake", { times:3 }, 50); error++; } else { $(this).addClass('valid'); } }); if(error <= 0) { //update progress bar $('#progress_text').html('25% Complete'); $('#progress').css('width','85px'); //slide steps $('#first_step').slideUp(); $('#second_step').slideDown(); } else return false; }); $('#back_second').click(function(){ //update progress bar $('#progress_text').html('0% Complete'); $('#progress').css('width','0px'); //slide steps $('#second_step').slideUp(); $('#first_step').slideDown(); }); $('#submit_second').click(function(){ //remove classes $('#second_step input').removeClass('error').removeClass('valid'); var fields2 = $('#second_step input[textarea]'); var error = 0; fields2.each(function(){ var value = $(this).val(); if( value.length<5 || value==field_values[$(this).attr('id')] ) { $(this).addClass('error'); $(this).effect("shake", { times:3 }, 50); error++; } else { $(this).addClass('valid'); } }); if(error <= 0) { //update progress bar $('#progress_text').html('50% Complete'); $('#progress').css('width','170px'); //slide steps $('#second_step').slideUp(); $('#third_step').slideDown(); } else return false; }); $('#back_third').click(function(){ //update progress bar $('#progress_text').html('25% Complete'); $('#progress').css('width','85px'); //slide steps $('#third_step').slideUp(); $('#second_step').slideDown(); }); $('#submit_third').click(function(){ //update progress bar $('#progress_text').html('75% Complete'); $('#progress').css('width','255px'); //prepare the fourth step var fields3 = new Array( $('#time').val(), $('#budget').val() ); var fields2half = new Array( $('#detail').val() ); var fields2 = new Array( $('#other').val(), $('#pages').val() ); var fields1 = new Array( $('#name').val(), $('#email').val(), $('#phone').val(), $('#contact').val(), $('#url').val() ); var tr = $('#fourth_step tr'); tr.each(function(){ //alert( fields[$(this).index()] ) $(this).children('.1 td:nth-child(2)').html(fields1[$(this).index()]); $(this).children('.2 td:nth-child(2)').html(fields2[$(this).index()]); $(this).children('.2half td:nth-child(2)').html(fields2half[$(this).index()]); $(this).children('.3 td:nth-child(2)').html(fields3[$(this).index()]); }); //slide steps $('#third_step').slideUp(); $('#fourth_step').slideDown(); }); $('#back_fourth').click(function(){ //update progress bar $('#progress_text').html('50% Complete'); $('#progress').css('width','170px'); //slide steps $('#fourth_step').slideUp(); $('#third_step').slideDown(); }); $('#submit_fourth').click(function(){ //send information to server //update progress bar $('#progress_text').html('100% Complete'); $('#progress').css('width','339px'); //slide steps $('#fifth_step').slideUp(); $('#fourth_step').slideDown(); if(error <= 0) { return true } else{ return false } }); }); Hi, I have a working contact form with 3 of the fields requiring validation and they work well. I have added extra fields to the form (StatusClass, Project, CameFrom). These 3 fields return fine but I need to validated them. My problem is that the new fields don't show in the behaviours/validate panel even though they are within the form tag. Can anyone give me any help and advice as to how to accomplish this? Many thanks Code below.... Code: <script type="text/JavaScript"> <!-- function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x; } function MM_validateForm() { //v4.0 var i,p,q,nm,test,num,min,max,errors='',args=MM_validateForm.arguments; for (i=0; i<(args.length-2); i+=3) { test=args[i+2]; val=MM_findObj(args[i]); if (val) { nm=val.name; if ((val=val.value)!="") { if (test.indexOf('isEmail')!=-1) { p=val.indexOf('@'); if (p<1 || p==(val.length-1)) errors+='- '+nm+' must contain an e-mail address.\n'; } else if (test!='R') { num = parseFloat(val); if (isNaN(val)) errors+='- '+nm+' must contain a number.\n'; if (test.indexOf('inRange') != -1) { p=test.indexOf(':'); min=test.substring(8,p); max=test.substring(p+1); if (num<min || max<num) errors+='- '+nm+' must contain a number between '+min+' and '+max+'.\n'; } } } else if (test.charAt(0) == 'R') errors += '- '+nm+' is required.\n'; } } if (errors) alert('The following error(s) occurred:\n'+errors); document.MM_returnValue = (errors == ''); } //--> </script > Code: <form action="contact_us.asp" method="post" name="contact" target="_parent" class="contentText" id="contact" onsubmit="MM_validateForm('FullName','','R','Telephone','','RisNum','Email','','RisEmail');return document.MM_returnValue"> <table width="100%" border="0" cellspacing="5" cellpadding="0"> <tr> <td width="54%" class="subHeader">Full Name* </td> <td width="46%" class="subHeader"><input name="FullName" type="text" id="FullName" /></td> </tr> <tr> <td class="subHeader">Company Name </td> <td class="subHeader"><input name="CompanyName" type="text" id="CompanyName" /></td> </tr> <tr> <td class="subHeader">Address</td> <td class="subHeader"><input name="Address1" type="text" id="Address1" /></td> </tr> <tr> <td class="subHeader"> </td> <td class="subHeader"><input name="Address2" type="text" id="Address2" /></td> </tr> <tr> <td class="subHeader"> </td> <td class="subHeader"><input name="Address3" type="text" id="Address3" /></td> </tr> <tr> <td class="subHeader">Postcode</td> <td class="subHeader"><input name="Postcode" type="text" id="Postcode" /></td> </tr> <tr> <td class="subHeader">Telephone Number* </td> <td class="subHeader"><input name="Telephone" type="text" id="Telephone" /></td> </tr> <tr> <td class="subHeader">Mobile Number </td> <td class="subHeader"><input name="Mobile" type="text" id="Mobile" /></td> </tr> <tr> <td height="25" class="subHeader">Email Address* </td> <td class="subHeader"><input name="Email" type="text" id="Email" /></td> </tr> <tr> <td height="30" class="subHeader">Status*</td> <td class="subHeader"><select name="StatusClass" id="StatusClass"> <option selected="selected">Please Choose</option> <option>Architect</option> <option>Interior Designer</option> <option>Private Client</option> <option>Student</option> <option>Trade Enquiry</option> </select> </td> </tr> <tr> <td height="23" class="subHeader">Project*</td> <td class="subHeader"><select name="Project" size="1" id="Project"> <option selected="selected">Please Choose</option> <option>Planning Stages</option> <option>New Build</option> <option>Refurbishment</option> <option>Barn Conversion</option> <option>No project - information only</option> </select> </td> </tr> <tr> <td height="37" class="subHeader">How did you hear about us?*</td> <td class="subHeader"><select name="CameFrom" size="1" id="CameFrom"> <option selected="selected">Please Choose</option> <option>Web Search</option> <option>Grand Designs</option> <option>Living Etc</option> <option>Home Building & Renovation</option> <option>Architect</option> <option>Friend/Family</option> <option>Magazine/Editorial</option> <option>Newspaper Article</option> <option>Trade Show/Exhibition</option> <option>Other</option> </select></td> </tr> <tr> <td height="24" class="subHeader">Brochure Request </td> <td class="subHeader"><input name="Brochure" type="checkbox" id="Brochure" value="checkbox" /></td> </tr> <tr> <td class="subHeader">Message</td> <td class="subHeader"><span class="style4"> <textarea name="Message" id="Message"></textarea> </span></td> </tr> <tr> <td class="subHeader"> </td> <td class="subHeader"><input name="Submit" type="submit" value="Submit" /></td> </tr> <tr> <td colspan="2" class="subHeader"><em>* Required fields</em></td> </tr> </table> </form> |