I am creating an HTML form, and I have text fields in my form that ask people to fill in their name. I don't want to user to fill in any of these characters when filling out their name-
! @ # $ % ^ & * ( ) _ - + = { [ } ] | \ : ; " ' < , > . ? / 1 2 3 4 5 6 7 8 9
Is there any certain way I can do this? Thanks!
Ok, well you should really check for these characters at both the client-side using Javascript, and at the server-side using whatever you're using, PHP, ASP.NET, etc. Let me explain why you need each.
You should do the javascript validation because you want your user to see they did something wrong if they type in a disallowed character. For instance, you might make a warning in red test visible if it is not valid.
You might think that would take care of the problem, and it would, unless your users are crafty, and trying to screw with you. They can force a submission to your server that you would have checked for with your javascript if they had actually been using your page unmodified. They can easily rewrite your javascript to be whatever the heck they want. However, they cannot rewrite your validation code if it is running on your server when your server gets a submission.
So the javascript is for user-friendliness, and the server code is for security.
I don't know what back-end you're using, so I can't really help with that, but it will be fairly similar in functionality to the javascript code. Here we go.
Here's an example html document with a form:
<html>
<form
name="signupForm" action="registerUser.asp"
onsubmit="return validateForm()" method="post">
First name: <input id="nameInput" type="text" name="name">
<input type="submit" value="Submit">
</form>
</html>
Ok, now here's some accompanying javascript to implement that validateForm() function we saw:
function validateForm() {
var x = document.forms["signupForm"]["name"].value;
if (x == '!' || x == '@' || x == '#' || ... all your other conditions too ...) {
alert("Name cannot contain ... blah blah blah... characters.");
return false;
}
}
And that right there would do it for ya. Keep in mind please, that using the alert function is frowned upon. It's really antiquated and just not a good user experience. Perhaps instead you could put in a line of javascript to make a hidden text message near the input box visible, that displays the message instead. I'm sure you've seen that kind of thing before, and it's much more pleasant than an obnoxious pop-up message. You're not trying to punish your users for their typing mistakes.
Hope this helps. Also, you might want to consider allowing hyphens, they are really quite common in people's legal names. If this is your method of sanatizing database inputs, you're doing that the wrong way.
