Click here to Skip to main content
13,004,188 members (75,818 online)
Click here to Skip to main content
Add your own
alternative version


16 bookmarked
Posted 4 Jun 2006

Client side validation without any extra code

, 4 Jun 2006
Rate this:
Please Sign up or sign in to vote.
We can validate web forms using regular expression,just put regular expression in the value attribute of hidden field and make your life easier
<!-- Article Starts - DO NOT ADD HTML/BODY START TAGS-->


Its a simple javascript code.By using this code we can validate web forms using regular expression. The good thing of it, you dont need to write extra code, just put appropriate regular expression in the value attribute of hidden field and make your life easier. 


Idea behind that is, For validating a control of name "text1" u have to add two hidden input fields.One for validation and other for control caption. the name of validation field would be "regex_text1" and the name of caption would be "caption_text1".

Your input control would be validated according to  the regular expression which you will write in the value attribute of  "regex_text1" input field.

Another thing u have to do is, Call following function on click of a button which you are using for submission.

<BLOCKQUOTE dir=ltr style="MARGIN-RIGHT: 0px">
<P>function ValidateForm()<BR>{<BR>     els=new Array();<BR>     els=document.forms[1].elements;<BR>     for(i=0; i<els.length; i++)<BR>     {<BR>  <BR>         var regex="regex_" + els[i].name;<BR>         if(els[regex]!=null)<BR>         {  <BR>                var regexValue=els[regex].value;<BR>                var elValue=els[i].value;<BR>                var re = new RegExp(regexValue);<BR>                if(!elValue.match(re))<BR>                {<BR>                       var caption="caption_" + els[i].name;<BR>                       var captionValue="Field"; <BR>                       if(els[caption]!=null)<BR>                             captionValue=els[caption].value;<BR>                       alert("Invalid " + captionValue);<BR>                       return; <BR>                }<BR>         }    <BR>    <BR>  <BR>   <BR>     }<BR>     document.forms[1].submit();</P>
<P dir=ltr>and your html would be like this.</P>
<BLOCKQUOTE dir=ltr style="MARGIN-RIGHT: 0px">
<P dir=ltr><input type="text" name="txtSurname"><BR>                <input type="hidden" name= "caption_txtSurname" value="Surname"><BR>                <input type="hidden" name= "regex_txtSurname" value="^[a-zA-Z]+[a-zA-Z ]*$"></P>
<P dir=ltr><input type="text" name="txtPostCode"><BR>                              <input type="hidden" name="regex_txtPostCode" value="^([0-9]+[0-9-]*[0-9]+)?$"><BR>                <input type="hidden" name= "caption_txtPostCode" value="Post Code"></P>
<P dir=ltr><input  type="button" name="Submit" value="Submit" onClick="javascript:ValidateForm()"></P></BLOCKQUOTE>


This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here


About the Author

Sheikh Abdul Wahid
Software Developer (Senior) Avanza Solutions Pakistan Karachi
Pakistan Pakistan
No Biography provided

You may also be interested in...

Comments and Discussions

QuestionHidden fields? Pin
Richard Schaefer22-Jun-06 8:03
memberRichard Schaefer22-Jun-06 8:03 
AnswerRe: Hidden fields? Pin
blumenhause7-May-07 18:39
memberblumenhause7-May-07 18:39 
Generalusing one regex for a serial field Pin
zleeway18-Jun-06 16:49
memberzleeway18-Jun-06 16:49 
NewsJust a warning though, don't merely trust client -side for validation. [modified] Pin
volkan.ozcelik12-Jun-06 21:10
membervolkan.ozcelik12-Jun-06 21:10 
Generala GOOD idea Pin
WuJunyin12-Jun-06 16:23
memberWuJunyin12-Jun-06 16:23 
Generalupdate [modified] Pin
David Cook12-Jun-06 5:54
memberDavid Cook12-Jun-06 5:54 
GeneralRe: update Pin
Spiff Dog12-Jun-06 19:18
memberSpiff Dog12-Jun-06 19:18 
GeneralRe: update Pin
David Cook13-Jun-06 2:51
memberDavid Cook13-Jun-06 2:51 
GeneralRe: update Pin
blumenhause7-May-07 19:02
memberblumenhause7-May-07 19:02 
GeneralRe: update Pin
Spiff Dog29-Oct-07 13:36
memberSpiff Dog29-Oct-07 13:36 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink | Advertise | Privacy | Terms of Use | Mobile
Web02 | 2.8.170627.1 | Last Updated 5 Jun 2006
Article Copyright 2006 by Sheikh Abdul Wahid
Everything else Copyright © CodeProject, 1999-2017
Layout: fixed | fluid