HTML - Form Validation Problem
Hi Ya,
I am trying to validate the telephone number for a form. I would really like some help. You see when i leave the telephone field blank the code error message comes up telling me that i cant leave that field blank. When i then put in illegal characters it says that i used illegal characters but instead of clearing the feild,allowing me to type the correct phone number and then moving onto the getradio if statement it goes to receipt page when the submit button is clicked instead of doing the validate checks first and then moving onto the receipt.html page. This is the problem area. Code: if (form.phone.value == "") { alert("Please enter your telephone number for shipping Information."); form.phone.focus(); return (false); } else { validate(); } if (getRadio("pay") == null) { alert("Please choose a payment method."); return (false); } return (true); } //--></script> <script language="javascript"> function validate() { if (isNaN(parseInt(this.value))) { alert("The phone number contains illegal characters."); form.phone.focus(); return (false); } } //--></script> The below code is for the form. Code: <FORM name="information" action="..\..\Cars\GT\receipt.html" method="get" onSubmit=" return form_Validator(this)"> <!-- Tells the button what action to take --> The below code is the full validation check function Code: <!-- This is used to validate the radio buttons to make sure that one of those options are pressed --> <script language="javascript"> function getRadio(radioName){ var inputs = document.getElementsByTagName('input'); var ret = null; for(var i = 0; i < inputs.length; i++){ if(inputs[i].type == 'radio' && (inputs[i].name == radioName || inputs[i].id == radioName) && inputs[i].checked){ ret = inputs[i].value; } } return ret; } <!-- This is used to validate the text boxes to make sure that an item is written into it --> <!-- I f the next box remains empty an error message appears --> function form_Validator(form) { if (form.first_name.value == "") { alert("Please enter your first name for shipping Information."); form.first_name.focus(); return (false); } if (form.last_name.value == "") { alert("Please enter your last name for shipping Information."); form.last_name.focus(); return (false); } if (form.address.value == "") { alert("Please enter your address for shipping Information."); form.address.focus(); return (false); } if (form.acode.value == "") { alert("Please enter the area code for shipping Information."); form.acode.focus(); return (false); } if (form.phone.value == "") { alert("Please enter your telephone number for shipping Information."); form.phone.focus(); return (false); } else { validate(); } if (getRadio("pay") == null) { alert("Please choose a payment method."); return (false); } return (true); } //--></script> <script language="javascript"> function validate() { if (isNaN(parseInt(this.value))) { alert("The phone number contains illegal characters."); form.phone.focus(); return (false); } } //--></script> </head> Similar TutorialsI'm using Godaddy's gdform.php form mailer for my forms. The forms work perfectly except the validation. I need the visitors to fill in the fields and then submit the information to my email, but the problem is that everyone can submitt even if he doesn't fill in the form. I want all of the fileds to be required. Is there something wrong with the code ? Here it is : <form action="/gdform.php" method="post"> <table align="center"> <input type="hidden" name="subject" value="Form Submission"> <input type="hidden" name="redirect" value="/Add/thankmes.html"> <input type="hidden" name="required" value="YourName, Email, description"> <tr> <td><p><font color=WHITE font size=4>Your Name:</p> </font></td> <td align=center height=50><p><input type="text" name="YourName" size="52"/></p></td> </tr> <tr> <td><p><font color=WHITE font size=4>Your E-mail:</p> </font></td> <td height=50><p><input type="text" name="Email" size="52"/></p></td> </tr> <tr> <td><p><font color=WHITE font size=4>Your Message:</p> </font></td> <td><br><p><textarea name="description" cols="40" rows="5"> </textarea></p></td> </tr> <tr> <td><input type="submit" name="submit" value="Send"/></td> </tr> </table> </form> Hello, I have an trouble with an html form validation called in a div with a javascript code for form validation. I have a main page in which I have a named div(workplace) where I call a html form page. Once the form page is called in the "workplace" div, the form is working, I can submit the entries to the database but the javascript validation doesn't work. But if I open the form in a decicated browser window then the javascript form validation works. I want to use div because everywhere I'm reading that "frames" is the devil and I should use div tag instead. Where could be my trouble? Your help is appreciated. Below there are my main page & form page. Main page html code Code: <html> <head> <script type="text/javascript" src="../library/ajax_navagation.js"></script> <title>My Web page</title> </head> <body> <div id="Menu"> <p><a href="javascript:void(0)" onClick="open_url('../admin/adduser.html', 'workplace');">Add user</a></p> <p><a href="javascript:void(0)" onClick="open_url('../admin/showusers.php', 'workplace');">Show users</a></p> </div> <div id="workplace"></div> </body> </html> Add user form with javascript for form validation Code: <script type="text/javascript"> <!-- function MM_validateForm() { //v4.0 if (document.getElementById){ 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=document.getElementById(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> Add new user <form action="../ui/admin/adduser.php" method="post" name=adduser onSubmit="MM_validateForm('username','','R','password','','R',);return document.MM_returnValue"> <table width="400" border="0" cellspacing="1" cellpadding="2"> <tr> <td width="100">Username</td> <td><input name="username" type="text" id="username"> *</td> </tr> <tr> <td width="100">Password</td> <td><input name="password" type="text" id="password"> *</td> <tr> <td width="100"> </td> <td> </td> </tr> <tr> <td width="100"> </td> <td><input name="add" type="submit" id="add" value="Add New User" ></td> </tr> </table> </form> Hi guys i have a form that has name , email , country (drop down list ) , state , city , address , phone . I would like to validate the form so that when a space is left empty for example the "name" space is left empty a message box alerts them When trying to validate more then one text box, the code ignores the first set of code and moves straight to the second :\ why does it do that? HTML Code: <script type="text/javascript"> <!-- function validate_form ( ) { valid = true; if ( document.MyFrom.fname.value == "" ) { alert ( "Please fill in the 'Your Name' box." ); valid = false; } return valid; } function validate_form ( ) { valid = true; if ( document.MyFrom.lname.value == "" ) { alert ( "Please fill in the 'Youlr Name' box." ); valid = false; } return valid; } </script> Hi everyone, does anyone know how to make it so, on a form, when a person inputs their phone number it wont accept anything less than 11 numbers and anything more than 11 numbers? Thanks Could someone please advise how to make a singular field validated before sending via smtp, through a Content Management system. I do not have access to the CSS side of things and am hoping this will help my own knowledge banks. The RTE does accept some types of Javascrpt but a resolution in this would ahve to be very simple. Appreciated any help given, thanks all. Tom Hi I am using a CGI-BIN script to submit an html form to an email address. I am wondering how i can make field in this html form "required"?? Would be thankful if someone could point me in the right direction. Hi I realy need help with my coursework! I am really bad with HTML and forms I want my form to not send to the email address i have specified unless all the fields in the form are full, this wont be a problem with the select boxes and the radio buttons as they are already selected. I only need to validate the text field and area. This is my form 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>Untitled Document</title> <style type="text/css"> <!-- body,td,th { font-family: Arial, Helvetica, sans-serif; } .style1 {color: #FFFFFF} .style2 {font-size: 14px} --> </style> <form action="script.cgi" onSubmit="return checkform()"> <script> function checkform() { if (value of textfield is null) { alert('Please insert your name'); return false; } else if(value of textarea is null) { alert('Please enter your comments for this website'); return false; } return true; } </head> <body> <form action="emailformhandler.php" method="post" name="Feedback Form" class="style2" id="Feedback Form"> <p align="left">Your Name <span class="style1"> .................................................</span> <input type="text" name="textfield" size="30" maxlength="100" /> </p> <p>Where do you live? <span class="style1">....................................</span> <select name="select" size="1"> <option>Dunstable</option> <option>Luton</option> <option>Houghton Regis</option> <option>Other</option> </select> </p> <p>How did you find out about this website? <span class="style1">....</span> <select name="select2" size="1"> <option>Your Teacher</option> <option>Mr Holmes</option> <option>Word Of Mouth</option> <option>SSCO</option> <option>Search Engine</option> <option>Other</option> </select> </p> <p><img src="http://himeshs.co.uk/ICT/untitled.GIF" width="181" height="56" /><span class="style1">.......................</span> <textarea name="textarea" cols="30" rows="5"></textarea> </p> <p> What is your rating of this website <span class="style1">.............</span> <input name="radiobutton" type="radio" value="radiobutton" checked /> Excellent <input name="radiobutton" type="radio" value="radiobutton" /> Good <input name="radiobutton" type="radio" value="radiobutton" /> Average <input name="radiobutton" type="radio" value="radiobutton" /> Poor</p> <p> <input type="submit" name="Submit" value="Submit Form" /> <input type="reset" name="Submit2" value="Clear Form" /> </p> </form> </body> </html> I would appreciate any help i could get and dont forget im a noob at forms nd stuff like that lol Thanks! Himesh If you look here at http://www.babyjai.com/quote.php you will see the form validates before it tries to push it thru, how come when you look at http://dinasky.me/contact.php it doesnt do it, it just pushed it thru, i cannot figure it out! I have a form that i want to ensure is filled out correctly before the user is able to proceed. http://chimp.cc/start.htm If the user fails to fill out the terms and conditions box with a "Yes"when the user clicks submit, i want a message to pop up to tell them to complete it. and to return the user to that field for completion. I honestly have no idea how to do this, can someone please help me. I have attached the source code too. Cheers Andy Hi, I'm new to the forums, so if this is in the wrong place i apologize. I've been thrown into the fire at work to develop some of the website and I'm absolutely stuck on one of my forms. It's submitting name, email and a couple checkboxes. I need the script to verify that the fields are not blank, the email field is a valid address, and the checkboxes are checked. Any ideas? <body> <script> function Do_it() { if(document.Form1.FirstName.value == "") { errormessage += "\n\nPlease fill out your first name."; } if(document.Form1.LastName.value == "") { errormessage += "\n\nPlease fill out your last name."; } if(document.Form1.email.value == "") { errormessage += "\n\nPlease fill out your email address."; } if(document.Form1.checkbox1.value == "") { errormessage += "\n\nPlease verify you are 13 or older."; } if(document.Form1.checkbox2.value == "") { errormessage += "\n\nPlease verify you have read and agree to the Privacy Policy."; } } return false; else return true; } </script> <div id="Layer1"> <div align="center"><img src="bg.jpg" width="800" height="600" /> </div> <div id="Layer13"> <form action="feedback.php" method="post" name="Form1" onSubmit="return Do_it()"> <table width="100%" height="100%" border="0" cellpadding="5" cellspacing="2" style="width: 445px; height: 100%;"> <tr> <td nowrap="nowrap"><div align="right"> First Name:</div></td> <td><input class="dsR2" type="text" name="FirstName" size="43" /></td> </tr> <tr> <td nowrap="nowrap"><div align="right"> Last Name:</div></td> <td><input class="dsR3" type="text" name="LastName" size="43" /></td> </tr> <tr> <td nowrap="nowrap"><div align="right"> E-mail:</div></td> <td><input class="dsR4" type="text" name="email" size="43" /></td> </tr> <tr> <td nowrap="nowrap"><div align="right"> <input class="dsR1" type="checkbox" name="checkbox1" /> </div></td> <td> I am over 13 years of age. </td> </tr> <tr> <td nowrap="nowrap"><div align="right"> <input class="dsR1" type="checkbox" name="checkbox2" /> </div></td> <td>I read and agree to the <a href="terms.html" target="_blank">Privacy Policy </a></td> </tr> <tr> <td colspan="2" nowrap="nowrap"><div align="center"> <p> <input name="submit" type="submit" class="dsR1" value="Submit" /> </p> </div></td> </tr> <tr> <td colspan="2" valign="top"><div align="center"><span class="style1"> </span> <div id="Layer3"> <div align="center"><span class="style2">We respect your privacy and understand the value of protecting personally identifiable information, we pledge not to sell any personally identifiable information to any third party</span>.</div> </div> </div></td> </tr> </table> </form> </div> </body> have a form.. has certain input fileds like - sptn, rptn, mps, mpr etc am trying to validate all entries to be entirely numeric and within range if (sptn>0 && sptn<65535 && rp>0 && rp<65535 && rptn>0 && rptn<65535 && mps>0 && mps<65535 && mpr>0 && mpr<65535) alert("all values ok"); problem is => this works even if i enter any of the values as =-=-=- or ./,/.,-= or any other junk characters but this snippet works fine if (spn>99 && spn<=999 && rpn>99 && rpn<=999) alert("ok"); please advise <form class="contact" method="post" action="mail.php#contact" /> I've reduced the errors down to two but I'm stuck on fixing these final connected errors relating to the form apparently not being open, but it is! Could someone please see below and tell me what they think? http://validator.w3.org/check?uri=ht...alidator%2F1.2 Thank you. I am having problem in validation of http://www.outsourcingi.com/articles.php Following three things are creating problems: Line 16, column 6: end tag for element "HEAD" which is not open . Line 17, column 5: document type does not allow element "BODY" here . Line 83, column 76: cannot generate system identifier for general entity "cat" . Please see if you can help me. thank you Code: <META NAME="keywords" CONTENT="diet, weight loss, magic chicken diet, chicken di Error: there is no attribute "NAME". Code: <META NAME="keywords" CONTENT="diet, weight loss, magic chicken diet, chicken di Error: there is no attribute "CONTENT". Code: ss, magic chicken diet, chicken diet"> Error: element "META" undefined. Code: <embed src="http://www.magicchickendiet.com/flash_header.swf" qual Error: there is no attribute "src". here is complete list of issues, Please help me if you can . thanks. I am trying to make my contact page pass the W3C validation test. I have tried putting the form names (your name, your email and subject) in a p class with a defined font family and size because I think this is what W3C is telling me what to do but I still get lots of errors.. This is my form: HTML Code: <form method="post" action="contact.php">your name:<br /> <input type="text" name="name" size="19"><br />your email:<br /> <input type="text" name="email" size="19"><br />subject:<br /> <textarea rows="5" name="message" cols="30"></textarea> <br /> <input type="submit" value="submit" name="submit"> </form> Please can someone shed some light onto this? http://validator.w3.org/check?uri=ht...idator%2F1.767 http://www.ilustrationbeast.com/bio.html on every page the same thing pops up as incorrect, and i'm not really sure what it's asking me to do? without that line the image map doesn't work, but apparently it's incorrect to have it there as is? i tried to mess with it, and i'm gonna go ahead and say i failed Hi, I'm trying to debug some code and, in spite of running it cleanly through the W3C validator, still have some big issues. The site runs fine in Chrome but displays incorrectly in IE and FireFox. You can see the site at www.iwailingwall.com Firefox is giving the following error: Error: [Exception... "Component returned failure code: 0x80040111 (NS_ERROR_NOT_AVAILABLE) [nsIXMLHttpRequest.statusText]" nsresult: "0x80040111 (NS_ERROR_NOT_AVAILABLE)" location: "JS frame :: file:///C:/Program%20Files/Mozilla%20Firefox/components/nsBlocklistService.js :: anonymous :: line 548" data: no] Source File: file:///C:/Program%20Files/Mozilla%20Firefox/components/nsBlocklistService.js Line: 548 IE is not showing any errors. I would really appreciate any help on the display issue as well as a pointer to browser-specific code validators if they exist. Thanks in advance for any help you can provide. Please let me know if I can provide any additional information to assist in a diagnosis. The problematic code is: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>The Wailing Wall</title> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <!-- SWFObject embed by Geoff Stearns geoff@deconcept.com http://blog.deconcept.com/swfobject/ --> <script type="text/javascript" src="swfobject.js" /> <style type="text/css"> textarea#styled { width: 600px; height: 120px; border: 3px solid #cccccc; padding: 5px; font-family: Tahoma, sans-serif; background-color: rgb(255,255,204); background-position: bottom right; background-repeat: no-repeat; } body { padding: 20px; background-color: rgb(238, 238, 238); font-family: Calibri; font-size: larger; color: rgb(255, 255, 204); font-weight: bolder; text-align: center; } </style> </head> <body style="background-image: url(HortonRockWall2.jpg);text-align:center;"> <table align="center"> <tr> <td> </td> <td align="left" > <font size="8" />The Wailing Wall <br /> <font size="4" />Tuck your worries here, snug among all our worries. <br />We'll keep them safe so you can let them go. </td> <td> </td> </tr> <tr> <td> </td> <td><table><tr><td> <div id="flashcontent">This will be shown to users with no Flash or Javascript.</div> <script type="text/javascript"> var myWidth = 0, myHeight = 0; var maxHeight = 0; myWidth = 600; myHeight = 600; if (myWidth > myHeight) maxHeight = .75* myHeight; else maxHeight = .75* myWidth; var so = new SWFObject("tagcloud.swf", "tagcloud", maxHeight, maxHeight, "7", "#000000"); // uncomment next line to enable transparency so.addParam("wmode", "transparent"); so.addVariable("tcolor", "0xFFFFCC"); so.addVariable("mode", "tags"); so.addVariable("distr", "true"); so.addVariable("tspeed", "60"); so.addVariable("tagcloud", "%3Ctags%3E%3Ca+href%3D%27%2Findex.php%3Fid%3D98%27+style%3D%2710%27%3EAdd+to+the+wall+here....%3C%2 Fa%3E%3Ca+href%3D%27%2Findex.php%3Fid%3D97%27+style%3D%2710%27%3EAdd+to+the+wall+here....%3C%2Fa%3E% 3Ca+href%3D%27%2Findex.php%3Fid%3D96%27+style%3D%2710%27%3EI+hate+meetings+about+meetings...%3C%2Fa% 3E%3Ca+href%3D%27%2Findex.php%3Fid%3D94%27+style%3D%2710%27%3EI+am+worried+that+the+recessio...%3C%2 Fa%3E%3Ca+href%3D%27%2Findex.php%3Fid%3D84%27+style%3D%2710%27%3EI+think+that+this+is+a+really+...%3 C%2Fa%3E%3Ca+href%3D%27%2Findex.php%3Fid%3D75%27+style%3D%2710%27%3EI+often+worry+that+I+am+a+****.. .%3C%2Fa%3E%3Ca+href%3D%27%2Findex.php%3Fid%3D74%27+style%3D%2710%27%3EI+worry+that+I%27ve+spent+4+y ea...%3C%2Fa%3E%3Ca+href%3D%27%2Findex.php%3Fid%3D73%27+style%3D%2710%27%3EI+worry+that+my+son+is+in heren...%3C%2Fa%3E%3Ca+href%3D%27%2Findex.php%3Fid%3D72%27+style%3D%2710%27%3EOne+worry+I+have+is+th at+someo...%3C%2Fa%3E%3Ca+href%3D%27%2Findex.php%3Fid%3D71%27+style%3D%2710%27%3EI+am+worried+about+ the+possibi...%3C%2Fa%3E%3Ca+href%3D%27%2Findex.php%3Fid%3D70%27+style%3D%2710%27%3EWhen+this+electi on+is+over%2C+I+...%3C%2Fa%3E%3Ca+href%3D%27%2Findex.php%3Fid%3D69%27+style%3D%2710%27%3EI+am+worrie d+about+what+I+am+g...%3C%2Fa%3E%3Ca+href%3D%27%2Findex.php%3Fid%3D68%27+style%3D%2710%27%3EIt%27s+f all+again+and+the+weath...%3C%2Fa%3E%3Ca+href%3D%27%2Findex.php%3Fid%3D67%27+style%3D%2710%27%3EI%27 m+worried+about+what%27s+goi...%3C%2Fa%3E%3Ca+href%3D%27%2Findex.php%3Fid%3D66%27+style%3D%2710%27%3 EHopefully+this+isn%27t+meta-ana...%3C%2Fa%3E%26nbsp%3B%26nbsp%3B+%3Ca+href%3D%27%2Findex.php%3Fpage%3D2%27+style%3D%2710%27%3ENe xt%3C%2Fa%3E++%3Ca+href%3D%27%2Findex.php%3Fpage%3D2%27+style%3D%2710%27%3ELast+Page%3C%2Fa%3E+%3Ca+ href%3D%27%2Findex.php%27+style+%3D%2710%27%3EReturn+to+main+page.%3C%2Fa%3E%3C%2Ftags%3E");so.write ("flashcontent"); </script> </td></tr> <tr><td align="center"> <font size='2' />Based on WP-Cumulus by <a href="http://www.roytanck.com/">Roy Tanck</a></td></tr> </table></td> <td valign='top'> <table style="width: 407px; margin-left: 30px; border-width:3;"> <tr> <td style="width: 383px;"> <form action='/index.php' method='post' name='contact_form' /> <textarea name="body" rows="5" cols="40">Add to the wall here.</textarea> </td> </tr> <tr> <td style="width: 383px;"><font size="3" />By: <input name="name" value="Anonymous" type="text" /><input value="Submit" name="Submit" type="submit" /><input value="Reset" name="Reset" type="reset" /> </td> </tr> <tr> <td style="width: 383px;"> <input name='reference' type='hidden' value='0' />What do you need to let go of? </td> </tr> </table> </td> </tr> </table> </body> </html> |