Follow Techotopia on Twitter

On-line Guides
All Guides
eBook Store
iOS / Android
Linux for Beginners
Office Productivity
Linux Installation
Linux Security
Linux Utilities
Linux Virtualization
Linux Kernel
System/Network Admin
Programming
Scripting Languages
Development Tools
Web Development
GUI Toolkits/Desktop
Databases
Mail Systems
openSolaris
Eclipse Documentation
Techotopia.com
Virtuatopia.com
Answertopia.com

How To Guides
Virtualization
General System Admin
Linux Security
Linux Filesystems
Web Servers
Graphics & Desktop
PC Hardware
Windows
Problem Solutions
Privacy Policy

  




 

 

Restricting a Field to Alphanumeric Only

JavaScript can be used to guide the user in entering correct data. This page describes a method for restricting entered data to just letters and numbers -- no spaces, commas or other types of characters are allowed. This technique is useful if you are asking for information such as a User ID which has only alphanumeric characters.

First, copy this JavaScript code into the <HEAD> section of your document:

<SCRIPT TYPE="text/javascript">
<!--
// copyright 1999 Idocs, Inc. https://www.idocs.com
// Distribute this script freely but keep this notice in place
function letternumber(e)
{
var key;
var keychar;

if (window.event)
   key = window.event.keyCode;
else if (e)
   key = e.which;
else
   return true;
keychar = String.fromCharCode(key);
keychar = keychar.toLowerCase();

// control keys
if ((key==null) || (key==0) || (key==8) || 
    (key==9) || (key==13) || (key==27) )
   return true;

// alphas and numbers
else if ((("abcdefghijklmnopqrstuvwxyz0123456789").indexOf(keychar) > -1))
   return true;
else
   return false;
}
//-->
</SCRIPT>

Using this script we can set a field as alphanumeric using the onKeyPress attribute. Use the exact onKeyPress attribute highlighted in this example. It is important that you use return in the attribute or the technique won't work..

<FORM ACTION="../cgi-bin/mycgi.pl" METHOD=POST>
User ID: <INPUT NAME=ID MAXLENGTH=8 onKeyPress="return letternumber(event)">
<INPUT TYPE=SUBMIT VALUE="go">
</FORM>

This creates this form:

User ID:

The next page shows a similar technique which allows you to restrict a field to just numbers.

 
 
  Copyright 1997-2002 Idocs inc. Published under the terms of the Open Content License Design by Interspire