Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
?
Solved

Only allow certain characters in an input field?

Posted on 2005-03-21
6
Medium Priority
?
9,517 Views
Last Modified: 2008-01-09
Is it possible to define which characters can be used for certain input fields? And I don't mean form validation, I know how to do that... I want to actually disallow the character from even showing up with typed. I am going to have several input fields on a page, some that only allow numbers, some that only allow text, some that allow HTML markup, is there a way I can define the characters in a function and assign the needed function to my input field? For example, say I have a field for your name, I do not want you to be able to put in a number, so I could have a funtion in my javascript that lists all of the available characters, let's call the function allow_alpha, in the HTML, i'd like to somehow assign that function to the field, like <input type="text" on keyup="allow_alpha();" /> or something to the sort. Is that possible? And I do not need an error checking as that will be done server side via PHP, plus there will be description letting the user know which characters they can use.
0
Comment
Question by:MaybeItsJeremy
  • 3
  • 2
6 Comments
 
LVL 32

Expert Comment

by:Batalf
ID: 13596548
This matches numbers only

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
<head>
<title>Letters ONLY</title>
<script type="text/javascript">

function alpha(e) {
    var k;
    document.all ? k = e.keyCode : k = e.which;
    var char = String.fromCharCode(k);
    if(!char.match(/[\d]/))return false;
   
    return true;
   
   
}

</script>
</head>
<body>
<div>
<form id="example" action="javascript://">
<input type="text" onkeypress="return alpha(event)" />
</form>
</div>
</body>
</html>
0
 
LVL 32

Expert Comment

by:Batalf
ID: 13596570
And by changing

if(!char.match(/[\d]/))return false;

to

if(!char.match(/[\dA-Z]/i))return false;

it matches numbers and letters only
0
 
LVL 31

Accepted Solution

by:
GwynforWeb earned 2000 total points
ID: 13596616
there are no bulit in functions but here are a few custom bulit

<script>
function allow_alpha(obj){
 if (/[^a-z]/i.test(obj.value))
  obj.value=obj.value.replace(/[^a-z]/gi,'')
  obj.value+=''
  obj.focus()
}

function allow_numeric(obj){
 if (/[^0-9]/i.test(obj.value))
  obj.value=obj.value.replace(/[^0-9]/g,'')
  obj.value+=''
  obj.focus()
}

function allow_alphaNumeric(obj){
 if (/[^\w]/i.test(obj.value))
  obj.value=obj.value.replace(/[^\w]/gi,'')
  obj.value+=''
  obj.focus()
}
</script>

<p><input type="text" onkeyup="allow_alpha(this);" / size="20">alpha</p>
<p><input type="text" onkeyup="allow_numeric(this);" / size="20">numeric</p>
<p><input type="text" onkeyup="allow_alphaNumeric(this);" / size="20">alpha numeric</p>
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
LVL 32

Expert Comment

by:Batalf
ID: 13596647
You should also have an onblur function which strips out illegal characters that might have been pasted into the text field:


<html>
<head>
<script type="text/javascript">
var pattern = /[^\dA-Z]/i;      // Disallowed characters
function alpha(e) {
      var k;
      document.all ? k = e.keyCode : k = e.which;
      var char = String.fromCharCode(k);
      if(char.match(pattern))return false;      
      return true;
}
function stripChars(obj){ // Strips out illegal characters from the text field
      var theValue = obj.value;
      theValue = theValue.replace(pattern,'');
      obj.value = theValue;
      
}

</script>
</head>
<body>
<div>
<form id="example" action="javascript://">
<input type="text" id="myTextField" onkeypress="return alpha(event)" onblur="stripChars(this)">
</form>
</div>
</body>
</html>
0
 

Author Comment

by:MaybeItsJeremy
ID: 13596673
@ GwynforWeb, exactly what I was looking for. Thanks.
0
 
LVL 31

Expert Comment

by:GwynforWeb
ID: 13597592
thx for the points :-)
0

Featured Post

Become an Android App Developer

Ready to kick start your career in 2018? Learn how to build an Android app in January’s Course of the Month and open the door to new opportunities.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In Part 1 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7849-Hex-Maze.html) we covered the hexagonal maze basics -- how the cells are represented in a JavaScript array and how the maze is displayed.  In this part, we'…
This article discusses how to implement server side field validation and display customized error messages to the client.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

578 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question