...

View Full Version : checking input for invalid characters?



angst
04-30-2004, 05:40 PM
hello all!

question,
how can i make sure that characters such as \ / : * ? " < > |
do not get entered into my input="test" feild?

any example would be great, I'm still very new to javascript..
thanks in advance for your time!

angst
04-30-2004, 06:58 PM
sorry, i ment my input="text" feild of course..

Philip M
04-30-2004, 07:31 PM
The simplest way to do this is to use a regular expression:-


EXAMPLE:-

<tr>
<td><font face="Arial"><em><b>Enter some text here</b></em></font></td>
<td><input type="text" size="25" maxlength="25" name="testext" onblur="if(/\W/g.test(this.value)){alert('You have entered an invalid character. Please try again.'); this.value=""; this.focus)}"> </font></td></tr>

\W means "any single non-word character", which is equivalent to anything except a-z A-z 0-9 and _

So if anything except a-z A-Z 0-9 and _ are found in the string, then the alert is triggered, the value reset to "" and the focus returned to that text box ready for a re-try.

Hope this helps.

But please do not say "thanks in advance". It may be cool but it is not polite.

angst
04-30-2004, 07:55 PM
hmm, i tested that code,, but it doesn't seem to work for me,
not sure what i'm doing wrong here,,
and like i said,, i'm still very new with this.

should this make it so that can't type those characters at all, or does it prompt them to say no?


thanks again for your time!
ken

Philip M
04-30-2004, 08:02 PM
Sorry Ken, there was a typo.

Try it again:-

<tr>
<td><font face="Arial"><em><b>Enter some text here</b></em></font></td>
<td><input type="text" size="25" maxlength="25" name="testext" onblur="if(/\W/g.test(this.value)){alert('You have entered an invalid character. Please try again.'); this.value=''; this.focus()}"> </font></td></tr>

As soon as the focus is removed (onblur) the text string is tested, and if an invalid character is present then an alert comes up with the message. Note that this does not cover where nothing at all is entered into the textbox. If you want that field to be required then further code is necessary.

It would be possible to check for an invalid charcater at every key stroke (see Sadiq infra) but I do not see much point in this. Presumably your users are advised as to what is acceptable in the textbox.

sad69
04-30-2004, 08:06 PM
Something like this maybe:


<html>
<head>
<title>Untitled</title>
</head>
<body>
<form action="" method="POST" id="myForm" >
<input type="text" name="myText" onKeyPress="return checkKey(event)">

<script type="text/javascript" language="JavaScript">
function checkKey(textBox, evt) {
var key;
if(window.event) {
key = window.event.keyCode;
}
else if(evt) {
key = evt.which;
}
else {
return; //weird browser
}

switch(key) {
case 92:
case 47:
case 58:
case 42:
case 63:
case 34:
case 60:
case 62:
case 124:
return false;
default:
return true;
}
}
</script>
</form>
</body>
</html>


Let me know how that works out for you.

Sadiq.

Philip M
04-30-2004, 08:13 PM
With respect, Sadiq, that seems an absurdly long way round to get the result which a regular expression deals with in afew characters. And your code only traps the characters listed, not every non-word character.

Other contributors have urged coders to learn regular expressions - they certainly have changed my coding abilities for the better!

sad69
04-30-2004, 08:26 PM
I actually started typing that post thinking mine would be the first reply!

I know it's a long way around, but I didn't realize that angst was concerned only with non-word characters. I took his list literally thinking there was some weird reason that he didn't want those characters to show..

Personally, I rarely think to use regex. It's usually the third solution that comes to mind! I really should try to think in terms of regular expressions more often as it does shorten the code and run more quickly.

Anyway.. angst, learn your regular expressions or else Dr. Phil's gonna be on your case ! :D

Sadiq.

Philip M
04-30-2004, 08:33 PM
Here is another way of doing it, with the advantage of being able to specify more closely which characters are invalid:-

<tr>
<td><font face="Arial"><em><b>Enter some text here</b></em></font></td>
<td><input type="text" size="25" maxlength="25" name="testsometext" onblur="checktext(this)"> </font></td></tr>

<SCRIPT = JavaScript>
function checktext(which) {
var badchars = '/\@:?%!&$#~<>^*+=";(){}[]'; // invalid characters in text box
var name = which.value;
for (var x=0; x < name.length; x++) {
if (badchars.indexOf(name.charAt(x))!=-1) {
alert ("You have entered invalid characters into this box. Please try again");
which.value=""; // clear the textbox - if required
which.focus(); // set the focus back to the textbox
return false;
}
}
}
</SCRIPT>

So you can permit punctuation characters such as . or , or whatever

If the text entered is lengthy you may wish to not clear the textbox, but simply require the user to try again by editing his input.

angst
04-30-2004, 09:17 PM
hey,
your guys are great!
thanks alot for all your help!

just wondering one thing about this script:

<html>
<head>
<title>Untitled</title>
</head>
<body>
<form action="" method="POST" id="myForm" >
<input type="text" name="myText" onKeyPress="return checkKey(event)">

<script type="text/javascript" language="JavaScript">
function checkKey(textBox, evt) {
var key;
if(window.event) {
key = window.event.keyCode;
}
else if(evt) {
key = evt.which;
}
else {
return; //weird browser
}

switch(key) {
case 92:
case 47:
case 58:
case 42:
case 63:
case 34:
case 60:
case 62:
case 124:
return false;
default:
return true;
}
}
</script>
</form>
</body>
</html>


i'm not using that one right now,
but what those this mean: case 62: ?
that those character codes or something? and if so were can i learn more about them?


again, thanks every one!
ken

sad69
04-30-2004, 09:37 PM
Yes you are right, they are character codes. You can get a complete listing here:
http://www.web-source.net/symbols.htm


Sadiq.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum