Regular Expressions Issue...

[chunk1978]

hi everyone... i'm preparing to complete a validated form through client-side javascript with regular expressions... and yes the form will also be validated server-side as well... anyway, my regex code is problematic, and i was wondering if someone who know about regular expressions really well could have a look at it and tell me what is the problem.

 
function checkform ( form )
    {
    if (!/[a-zA-Z]+$/.test(form.name.value)) {
    alert( "Please enter a valid NAME." );
    form.name.focus();
    return false ;}
 
    if (!/[\w\s]+$/.test(form.addressline1.value)) {
    alert( "Please enter a valid ADDRESS." );
    form.addressline1.focus();
    return false ;}
 
    if (!/[a-zA-Z]+$/.test(form.city.value)) {
    alert( "Please enter a valid CITY." );
    form.city.focus();
    return false ;}
 
    if (!/[a-zA-Z]+$/.test(form.provincestate.value)) {
    alert( "Please enter a valid PROVINCE/STATE." );
    form.provincestate.focus();
    return false ;}
 
    if (!/[\w\s]+$/.test(form.postalzip.value)) {
    alert( "Please enter a valid POSTAL/ZIP CODE." );
    form.postalzip.focus();
    return false ;}
 
(etc...)
 
 

for the NAME, CITY, and PROVINCE/STATE lines, i am trying to only allow for alphabetic strings (more than one string)... however, in testing i found that i can enter "New York City", where as i can not enter "123 #$% 789"... but unfortunately this code will also allow me to enter "123New $%^York 789City", so it's not functioning correctly...

i'm fairly new to regular expressions, and i would love to keep the code in it's current format to only validate on form submit, but either regular expressions is a buggy option, or i'm clearly missing something... (i'd vote on the latter)...

please help if you can... thanks

[AricC]

Without looking at the regex, why are you validating this data 2x? The reason I use Javascript to validate my web forms is to keep the load on the client machine not the server.

[acoder]

You need two anchors, you are only using one.
The two anchors are ^ and $, ^ is the start anchor and $ is the end anchor. At the moment, your regex matches anything ending with an alphabetic character.
So, use

if (!/^[a-zA-Z]+$/.test(form.name.value)) {

[acoder]

Without looking at the regex, why are you validating this data 2x? The reason I use Javascript to validate my web forms is to keep the load on the client machine not the server.

You need to validate data twice. If anything, validate only on the server side, users could have Javascript disabled.

See this link for more info.

[chunk1978]

You need two anchors, you are only using one.
The two anchors are ^ and $, ^ is the start anchor and $ is the end anchor. At the moment, your regex matches anything ending with an alphabetic character.
So, use

if (!/^[a-zA-Z]+$/.test(form.name.value)) {

hey... your code works, but it only allows me to enter one string of characters... so under name i can enter "John", but i can't enter "John Doe Smith"... the same goes for city... for city i can enter "Seattle" but i can't enter "San Francisco"... so how do i rewrite the regular expressions to allow for more than one string of characters?

thanks

[acoder]

hey... your code works, but it only allows me to enter one string of characters... so under name i can enter "John", but i can't enter "John Doe Smith"... the same goes for city... for city i can enter "Seattle" but i can't enter "San Francisco"... so how do i rewrite the regular expressions to allow for more than one string of characters?

thanks

For that you will need to allow spaces. This is one example, but others may come up with something more compact:

^[a-zA-Z]+([ ]{1}[a-zA-Z])*$

What this does is match an alphabetic character and then possibly matches 1 space followed by more alphabetic characters. The asterisk * means 0 or more. + means one or more. {1} means match exactly once.

[chunk1978]

For that you will need to allow spaces. This is one example, but others may come up with something more compact:

^[a-zA-Z]+([ ]{1}[a-zA-Z])*$

What this does is match an alphabetic character and then possibly matches 1 space followed by more alphabetic characters. The asterisk * means 0 or more. + means one or more. {1} means match exactly once.

ok... so if i understand correctly...

^[a-zA-Z]+([ ]{1}[a-zA-Z])*$

means that there must be 1 space between two alphabetic characters. so someone could enter "hi there" or "how's you?" into the textarea (they can not enter "hi" or "hi how's it going")

^[a-zA-Z]+([ ]{+}[a-zA-Z])*$

means that there must be at least one space between two or more alphabetic characters = "hi there" or "hi how's it going?" (but not "hi").

^[a-zA-Z]+([ ]{*}[a-zA-Z])*$

means that there can be some spaces or not, so someone could enter "hi", as well as "hi how's it going?" into the textarea.



i'm just asking now because i have to go out so i can't test it, and i'll be staying up all night when there's less live help on this site...

[chunk1978]

sorry, read your last instructions too quick... i though they all were in parenthesis, but only the number signifying spaces are (IE "{1}")... i got it now... thanks

^[a-zA-Z]+([ ]{1}[a-zA-Z])*$

means that there must be 1 space between two alphabetic characters. so someone could enter "hi there" or "how's you?" into the textarea (they can not enter "hi" or "hi how's it going")

^[a-zA-Z]+([ ]+[a-zA-Z])*$

means that there must be at least one space between two or more alphabetic characters = "hi there" or "hi how's it going?" (but not "hi").

^[a-zA-Z]+([ ]*[a-zA-Z])*$

means that there can be some spaces or not, so someone could enter "hi", as well as "hi how's it going?" into the textarea.

[acoder]

^[a-zA-Z]+([ ]{1}[a-zA-Z])*$

means that there must be 1 space between two alphabetic characters. so someone could enter "hi there" or "how's you?" into the textarea (they can not enter "hi" or "hi how's it going")

Actually they can enter "hi" because the whole of the second part is in parentheses with an asterisk, so the second part is an optional match. Actually, "how's it going?" would not match because of the apostrophe and question mark.

^[a-zA-Z]+([ ]+[a-zA-Z])*$

means that there must be at least one space between two or more alphabetic characters = "hi there" or "hi how's it going?" (but not "hi").

Yes that's right, but remember again about the ' and ? (I think you're just giving examples, but I thought I'd point it out anyway).

^[a-zA-Z]+([ ]*[a-zA-Z])*$

means that there can be some spaces or not, so someone could enter "hi", as well as "hi how's it going?" into the textarea.

Yes, again that's right. You're getting the hang of it.

Have you tested it and does it work?

[chunk1978]

Have you tested it and does it work?

yeah it's getting a lot easier... and it works... but i'm concerned that my code isn't neat, and therefore making the function work too hard... for example:

if (!/^[a-zA-Z0-9éèàïêâôÉÈÀÏÊÂÔ\-(\.)(\')(\,)(\#)]+([ ]*[a-zA-Z0-9éèàïêâôÉÈÀÏÊÂÔ\-(\.)(\')(\,)(\#)])*$/.test(form.addressline1.value)) {
    alert( "Please enter a valid ADDRESS." );
    form.addressline1.focus();
    return false ;}
 

is my current code for an address line. my website is going to be bilingual (English/French) so i'm allowing french characters... i'm also allowing hyphens, because a lot of streets here in Montréal are hyphenated (IE rue Ste-Catherine)... i'm also allowing number signs, commas, apostrophes, and periods... (IE rue Lamber's Closs blvd., Apartment #3)... it's making me a bit tense though, because i'm unaware of which characters are needed to allow for malicious code if someone wanted to trash my files/server...

also, i started a new discussion because there are optional fields on my form, and i'm not sure how to use regular expressions with an optional field... it seems to me that if regular expressions are implanted for the field, the field must be filled... am i wrong? i would really like to use regular expressions for the optional fields as well...

[acoder]

Why not split your address field to two or more fields, e.g. house name/no., street name, etc. It might make it easier, but considering you have so many possibilities, it may not make too much of a difference.

You're worried about SQL Injection. Read more about it here.

[chunk1978]

i'm just assuming that i'd be safe by not allowing forward or backward slashes, semi-colins, parenthesis, dollar signs, asterisks, carets, percent signs, etc... i hope my assumptions are correct.

[acoder]

Don't forget the single apostrophe ('). It should be allowed, e.g. Prince's Avenue, but you need to deal with it on the server side to make sure that any malicious input cannot misuse it.

[chunk1978]

Don't forget the single apostrophe ('). It should be allowed, e.g. Prince's Avenue, but you need to deal with it on the server side to make sure that any malicious input cannot misuse it.

i seem to be still having issues with the additional comments field... the field allows up to 500 characters to be entered, but the regex doesn't seem to be working as i want it to...

 
    if (!/^[a-zA-Z0-9çéèàïêâôÇÉÈÀÏÊÂÔ\-(\.)(\')(\,)(\")(\?)(\!)]+([ ]*[a-zA-Z0-9çéèàïêâôÇÉÈÀÏÊÂÔ\-(\.)(\')(\,)(\")(\?)(\!)])*$/.test(form.additionalcomments.value)) {
    alert( "Please remove Illegal characters from ADDITIONAL COMMENTS field.  Allowed characters include Letters, Numbers, Hyphens, Quotations, Apostrophes, Periods, Commas, Question and Esclimation Marks." );
    form.additionalcomments.focus();
    return false;}
 
 

any suggestions?

[chunk1978]

nevermind... i realized i had to allow for whitespaces and thus change the code to the following...

 
    if (!/^[a-zA-Z0-9çéèàïêâôÇÉÈÀÏÊÂÔ\s(\-)(\.)(\')(\,)(\")(\?)(\!)]+([ ]*[a-zA-Z0-9çéèàïêâôÇÉÈÀÏÊÂÔ\s(\-)(\.)(\')(\,)(\")(\?)(\!)])*$/.test(form.additionalcomments.value)) {
    alert( "Please remove Illegal characters from ADDITIONAL COMMENTS field.  Allowed characters include Letters, Numbers, Hyphens, Quotations, Apostrophes, Periods, Commas, Question and Esclimation Marks." );
    form.additionalcomments.focus();
    return false;}
 
 

[acoder]

nevermind... i realized i had to allow for whitespaces and thus change the code to the following...

if (!/^[a-zA-Z0-9çéèàïêâôÇÉÈÀÏÊÂÔ\s(\-)(\.)(\')(\,)(\")(\?)(\!)]+([ ]*[a-zA-Z0-9çéèàïêâôÇÉÈÀÏÊÂÔ\s(\-)(\.)(\')(\,)(\")(\?)(\!)])*$/.test(form.additionalcomments.value)) 
 

Are you sure you want to use \s?

\s is short for \f\n\r\t\v and some others which includes form feed, line feed, carriage return, horizontal tab and vertical tab.

Also, you can make it smaller (though not by much) by using i at the end, i.e. /i to denote case-insensitive search.

[chunk1978]

Are you sure you want to use \s?.

i'm not exactly sure... the textarea i'm using this regex on is a big text box, not just a single line... i want to allow the user to use the return key to start a new line, and maybe tabs if they so choose... without \s the field doesn't allow that... although i'm totally open to better suggestions.

[acoder]

i'm not exactly sure... the textarea i'm using this regex on is a big text box, not just a single line... i want to allow the user to use the return key to start a new line, and maybe tabs if they so choose... without \s the field doesn't allow that... although i'm totally open to better suggestions.

In that case, that should be fine. I only asked because you had mentioned earlier about spaces only.

[chunk1978]

In that case, that should be fine. I only asked because you had mentioned earlier about spaces only.

 
    if (!/^[a-zA-Z0-9çéèàïêâôÇÉÈÀÏÊÂÔ\-(\.)(\')(\,)(\")(\?)(\!)]+([ ]*[a-zA-Z0-9çéèàïêâôÇÉÈÀÏÊÂÔ\-(\.)(\')(\,)(\")(\?)(\!)])*$/.test(form.additionalcomments.value)) {
    alert( "Please remove Illegal characters from ADDITIONAL COMMENTS field.  Allowed characters include Letters, Numbers, Hyphens, Quotations, Apostrophes, Periods, Commas, Question and Esclimation Marks." );
    form.additionalcomments.focus();
    return false;}
 
 

now im having the strangest issue with this one regex for the additional comments text area... i've reduced the characters allowed to 300, instead of 500... but if i enter a few sentences, and if at the end of the comments box there is an illegal character (IE "#"), the normal alert box that is suppose to suddenly show up takes a few seconds to do so, and sometimes i noticed that it wouldn't be able to process and the browser would say the script isn't able to continue and crashes the script... i'm using Safari 2.0, and Firefox 2.0, on an iMac Intel Core 2 Duo (2.0GHZ)...

however, it also seems that if there's an illegal character at or near the beginning of the inputed text, the alert is instant and normal... is the problem that the regex code is too long? not neat enough? have you any suggestions to make it cleaner or compact?

[acoder]

You can use a case-insensitive match using the i flag

/^[a-z0-9çéèàïêâô\-\.\'\,\"\?\!]+([ ]*[a-z0-9çéèàïêâô\-\.\'\,\"\?\!])*$/i

[chunk1978]

You can use a case-insensitive match using the i flag

/^[a-z0-9çéèàïêâô\-\.\'\,\"\?\!]+([ ]*[a-z0-9çéèàïêâô\-\.\'\,\"\?\!])*$/i

great! didn't know about the \i... it defiantly shrinks all my regexes down a lot... thanks for the tip...

unfortunately it didn't fix the hangup/freeze for this additional comments box... the script hangs for a second or two if an illegal character is placed near the end of the input text which allows 300 characters and also "\s" (returns, etc.)... i don't think it's a big deal though, right now i'm more curious as to why it's happening than trying to fix it...

this is the regex for this js function:

    if (document.IMAGECtrlForm.additionalcomments.value != "") {
    if (!/^[a-z0-9çéèàïêâô\-\.\'\,\"\?\!\s]+([ ]*[a-z0-9çéèàïêâô\-\.\'\,\"\?\!\s])*$/i.test(form.additionalcomments.value)) {
    alert( "(bla bla bla)" );
    form.additionalcomments.focus();
    return false;}}
 

any ideas?