Link to home
Start Free TrialLog in
Avatar of chsalvia
chsalvia

asked on

Arrow keys in text input box

I created a text input box which is meant to accept number values only, and I thought it would be a good idea to use javascript to prevent users from typing in letters into the box, to save myself server-side validation.  The problem I've noticed is that with Firefox, when you limit the keyPress event by only allowing a certain range of values, Firefox takes this so seriously that you can't even use the arrow keys anymore.  IE however still lets you use the arrowkeys.  Unfortunately, there doesn't seem to be anyway to capture the arrow-key press, since it doesn't have an ascii value.  (Or maybe it's one of the control-values?)

Is there some way around this?  It would be very annoying to a firefox user to not be able to use the arrow keys in a text box.

Here's the function I use:

function processKey(ev) {
      var key = ev.keyCode || ev.which;
      if ( (key > 47 && key < 58) || (key == 46) ) return true; // allow only numbers or decimal point
      return false;
}
ASKER CERTIFIED SOLUTION
Avatar of Pravin Asar
Pravin Asar
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Sorry please ignore the above...

Place this into the input code. e.g.

<input type="text" onblur="this.value=this.value.replace(/\D/g,'');" onkeyup="this.onblur();" />