Special Characters Not Allowed

Tired of customers or visitors using characters that could possibly render your forms useless? This script prevents a user from entering certain special characters in designated form fields.

We have tested the code in IE 7.0, Firefox 2.0.0.6, Opera 9.23, Netscape 9.0b3, Netscape 8.1.3, AOL Explorer 1.5 and Safari 3.0.2. This script worked well in all platforms with no variations observed.

For your Information: Before we begin, we feel obligated to advise you that the above form is for all intensive purposes a "Stand Alone" script. In other words, it really does not do much of anything other than what you see. In order to make it function as designed, you need to incorporate it into a valid working form. If you do not have a good Solid Knowledge of HTML coding, javascripts, forms and reconfigurations, please "Do Not Attempt" this until you are Proficient in the aforementioned areas.

Depending on your knowledge of HTML and javascripts, this is an easy three (3) part copy and paste code that goes in both the <HEAD> and <BODY> sections (incorporated into a working form) of your document. It also makes use of an external .js file (no reconfigurations) you need to save and upload into your directory then add a snipplet of code into the <HEAD> section to call the external.js file.

Since there are actually no reconfigurations to be made other than selecting which of the three (3) sections of code within the <BODY> section you want to incorporate into your functional form, see below where and howto make this selection.

<------ <BODY> Section Of Code ------>

<form id="myform" method="" onsubmit="return false;">
This field will not accept special characters: (like !@#$%* etc,) - but accepts underscore _
<br>
<input type="text" size="35" name="comments" onkeyup="valid(this,'special')" onblur="valid(this,'special')"></textarea>
<br>
<br>
This field will not accept double or single quotes:
<br>
<input type="text" size="35" name="txtEmail" onkeyup="valid(this,'quotes')" onblur="valid(this,'quotes')">
<br>
<br>
This field will only accept integer numbers:
<br>
<input type="text" size="35" name="txtPostal" onkeyup="valid(this,'notnumbers')" onblur="valid(this,'notnumbers')">
</form>

<------ Explanations ------>

As you can notice in the coding on the left we have it divided into three (3) color coded sections

1) Section One
2) Section Two
3) Section Three

Whichever section(s) you want to use within your form, just remove the other(s).
Notice in each section of code there is a word which is unique to each section. This word is directly reflected from the external.js file (or possibly the <HEAD> secxtion) to tell the form what not to accept or allow.

Note Of Importance: If you are not sure of howto make the external .js file and make use of it within your document, grab the below link and it is fully explained.
[ .js File Howto ]

For your Information: If you are not comfortable or prefer not to use the external.js file, you can use the traditional cut/copy and paste instead of the external .js file. If you need a little refresher on what is required to achieve this, grab the below link and it is fully explained.
[ Traditional Cut/Copy and Paste ]

Depending on which of the above methods you have selected (external.js file or Traditional Copy/Cut & Paste), you will add either the snipplet of code (after you have uploaded the external.js file) into the <HEAD> section or the completed section of code that you added the opening and closing script tags.

Snipplet Of Code
<script type="text/javascript" src="blockKeyPress.js">
</script> Traditional Copy/Cut and Paste
<SCRIPT LANGUAGE="JavaScript">

<HEAD> Section of code goes here

// End -->
</script>

External .js file

Traditional Copy/Cut & Paste Code with opening & closing tags that you had to add into the <HEAD> section of code that was originally earmarked to be an external .js file.

If you would like to see an example of this effect using the "Traditional Cut/Copy & Paste" method, grab the below link and you are there. Examine our "Source" code (on the page you will be opening) to see how we had to reconfigure it to make it work. We have it very well documented for your convenience.
[ Traditional Cut/Copy & Paste Method ]

O nce you have completed either of the above steps for the <HEAD> section, all that is left is to paste the <BODY> section of code where you want the effect to appear.

We hope our tutorial was easy to follow and we covered everything in detail. If you would like to add this effect into your pages, grab the respective below link and you are there. If you have any problems with this or anything else, feel free to consult our [ FAQ ] and if you can't find the answer there, [ contact us ].
[ Get Code Here ] [ Rate This Page ]