All, I am trying to write a small snippet of javascript to validate an email when entered on a form. I am at my wits end. Can someone tell me what is wrong with the code below? <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>New Page 1</title> <script language=javascript TYPE=text/javascript"> function validEmail(email) { invalidChars = "/:;," if (email == "") { return false } for (i=0 i<invalidChars.length; i++) { badChar = invalidChars.charAt(i) if (email.indexOf(badChar,0) > -1) { return false } } atPos = email.indexOf("@",1) if (atPos == -1) { return false } if (email.indexOf("@"+1) > -1) { return false } periodPos = email.indexOf(".",atPos) if periodPos == -1) { return false } if (periodPos+3 > email.length) { return false } return true } function submitIt() { alert("entering submitIt function") if {!validEmail(emailForm.email.value)) { alert ("Invalid email address"); emailForm.email.focus() emailForm.email.select() return false } } </script> </head> <body> <form method="POST" action="mailto" onsubmit="return submitIt()"> <p align="center"><b> <font size="2"> Email:</font></b></p> <p align="center"> <input name="email" type="text" maxlength="100" size="25" id="email" class="input" style="width:136;BORDER-RIGHT: 1px solid #0E1C23; BORDER-TOP: 1px solid #000000; FONT-SIZE: 10px; BORDER-LEFT: 1px solid #000000; COLOR: #000000; BORDER-BOTTOM: 1px solid #000000; FONT-FAMILY: Times; BACKGROUND-COLOR: #ffffff; height:17" /> </p> <p align="center"> <input type="submit" value="Join" name="B1"></p> <p align="center"> </p> </form> </body> </html>
Try this, I highlighted all the changes I made. Code: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>New Page 1</title> <script language="javascript" TYPE="text/javascript"> function validEmail(email) { invalidChars = "/:;," if (email == "") { return false } for (i=0 [b];(change)[/b]i<invalidChars.length; i++) { badChar = invalidChars.charAt(i) if (email.indexOf(badChar,0) > -1) { return false } } atPos = email.indexOf("@",1) if (atPos == -1) { return false } if (email.indexOf("@"+1) > -1) { return false } periodPos = email.indexOf(".",atPos) if [b]((change)[/b]periodPos == -1) { return false } if (periodPos+3 > email.length) { return false } return true } function submitIt() { alert("entering submitIt function") if [b]((change)[/b]!validEmail([b]document.[/b]emailForm.email.value)) { alert ("Invalid email address"); [b]document.[/b]emailForm.email.focus() [b]document.[/b]emailForm.email.select() return false } } </script> </head> <body> <form method="POST" action="mailto" onsubmit="return submitIt();" [b]name="emailForm"[/b]> <p align="center"><b> <font size="2"> Email:</font></b></p> <p align="center"> <input name="email" type="text" maxlength="100" size="25" id="email" class="input" style="width:136;BORDER-RIGHT: 1px solid #0E1C23; BORDER-TOP: 1px solid #000000; FONT-SIZE: 10px; BORDER-LEFT: 1px solid #000000; COLOR: #000000; BORDER-BOTTOM: 1px solid #000000; FONT-FAMILY: Times; BACKGROUND-COLOR: #ffffff; height:17" /> </p> <p align="center"> <input type="submit" value="Join" name="B1"></p> <p align="center"> </p> </form> </body> </html>
Thanks Ludicrous but I dont think it is working. Maybe it is my browser? Nothing happens when I preview the code. I pasted your code in an html page all by itself and tested it. Did it work succesfully in your browser?
Use FireFox's JavaScript debugger... it will help so much... Several things I notice on your code: 1. End ALL statements with a ";", including the one on the "onSubmit" action 2. add a real action, not the "mailto" one. In fact, it's action="mailto:" instead. 3. on an if-else statement, if there is only one action to follow after the condition, you don't need braces: if (mynick == "SwoLy-D") do_something(); 4. you might want to tell the browser WHAT version of JavaScript you're using... <script language="JavaScript1.2"> is better than what you have, so the browser doesn't get confused EDIT: 5. the Invalid Chars list is best as an array, such as: var invalidChars = new Array(":","//"); (don't forget that if you want to use the character / literally, you have to escape it with "//", since JavaScript thinks you will be making a comment
I have an unrelated JavaScript question: Does anybody have experience with any of these Ajax/DHTML JavaScript Libraries: Dojo Toolkit http://www.dojotoolkit.org/ Ajax Toolbox http://www.javascripttoolbox.com/ jQuery http://jquery.com/ Moo.fx http://moofx.mad4milk.net/ Prototype http://prototype.conio.net/ Rico - Prototype derivative http://openrico.org/rico/home.page Sardalya http://www.sarmal.com/sardalya/Default.aspx Script.aculo.us - Prototype derivative http://script.aculo.us/ Tacos (A-) http://tacos.sourceforge.net/index.html TurboWidgets http://turboajax.com/turbowidgets/ TwinHelix http://www.twinhelix.com/ Wicket http://wicket.sourceforge.net/ Yahoo! User Interface Library http://developer.yahoo.com/yui/ (I got this list from Ajax/DHTML Library Scorecard:How Cross Platform Are They?) My project is thinking seriously about switching from Sarissa (AJAX JavaScript llibrary) to a more robust Ajax/DHTML library. Prototype (or one its deriviatives) looks to be a good candidate?