471,336 Members | 938 Online
Bytes | Software Development & Data Engineering Community
Post +

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 471,336 software developers and data experts.

Easy Form Validation with Javascript!

Form validation using JavaScript has never been as easy and simple! We
have developed a free generic form validation script that can validate
any form with very little JavaScript required in form!

For example:

A normal HTML form with out validation:

<form action="foobar.htm" method="get">
<div>Name: <input type="text" name="customerName" value=""></div>
<div>Email: <input type="text" name="customerEmail" value=""></div>
<div>Zip: <input type="text" name="customerZip" value=""></div>
<div><input type="submit" value="Submit"></div>
</form>

Simply add a few more attributes and you now have form validation:

<form action="foobar.htm" method="get">
<div>Name: <input type="text" required="yes" validate="text"
message="Please enter your name." name="customerName" value=""></div>
<div>Email: <input type="text" required="yes" validate="email"
message="Please enter a valid email address" name="customerEmail"
value=""></div>
<div>Zip: <input type="text" required="yes" validate="int"
message="Please enter a zip code" name="customerZip" value=""></div>
<div><input type="submit" value="Submit"
onClick="validate(this.form); return document.formSubmit;"></div>
</form>
You can get a free copy of the script here:
http://dboorn.com/javascript_form_va...n.php?catID=69. Please feel
free to download and use for any of your needs. As always please feel
free to let me know your thoughts!

Feb 24 '06 #1
2 2229
da**********@gmail.com wrote:
Form validation using JavaScript has never been as easy and simple!
As always please feel free to let me know your thoughts!


1. Not very backwards-compatible (not all browsers expose custom attributes
to js)
2. Very limited validation functionality
3. Creates potentially invalid HTML

Overall, it's not the best strategy.

--
Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com
Feb 24 '06 #2
VK

da**********@gmail.com wrote:
Simply add a few more attributes and you now have form validation:

<form action="foobar.htm" method="get">
<div>Name: <input type="text" required="yes" validate="text"


I would stay with the conventional styling way:
<input name="quantity" class="required numeric nozero"...
<input name="store" class="optional string"...
etc.

This way you would make it more cross-browser plus lesser risk to drive
crazy some over-sensitive parser :-)

Feb 24 '06 #3

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

5 posts views Thread by Weston C | last post: by
6 posts views Thread by Darren | last post: by
16 posts views Thread by Hosh | last post: by
9 posts views Thread by julie.siebel | last post: by
27 posts views Thread by Chris | last post: by
11 posts views Thread by Rik | last post: by

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.