SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Addict Skookum's Avatar
    Join Date
    Sep 2006
    Location
    Idaho
    Posts
    375
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Key Block on Forms

    I am trying to build a form where I block specific keys from use on the keyboard. I am able to kind of get it up and running but not completely as of yet.

    I do understand that this will only work for people that have JavaScript enabled on their browsers, I will compensate for that on the DB side.

    I have a couple of things that I need to accomplish.

    1. Allow only Alpha (Letter keys).
    2. Allow only Numeric (Number keys).
    3. Block most if not all special keys (!@#$%^&*().......)

    So far my code has been failing and I am unsure as to why, I thought that my logic was sound, but obviously I am making a big mistake somewhere.

    I found some code online that blocks everything but numbers. The only problem with that code is that backspace, delete, enter, and the arrow keys do not work. So I tried altering the code to allow those keys to be pressed.

    !isNS4 is just to determine the browser type.

    Original Code
    Code:
    <input type=text name=txtPostalCode onKeypress="if(!isNS4){if(event.keyCode < 45 || event.keyCode > 57) event.returnValue = false;}else{if(event.which < 45 || event.which > 57) return false;}">
    Then I tried changing the code to where it looks more like this.
    Code:
    <input type=text name=txtPostalCode onKeypress="if(!isNS4){if((event.keycode > 8 && event.keycode < 8) || (event.keycode > 8  && event.keycode < 45) || (event.keycode > 57 && event.keycode < 1000)) event.returnValue = false;}else{if((event.which > 8 && event.which < 8) || (event.which > 8  && event.which < 45) || (event.which > 57 && event.which < 1000)) return false;}">
    The problem with this code is that I am still able to put in --- .... and ////
    . is Keycode 190
    / is Keycode 191
    - is Keycode 109

    So I can't figure out why those events are not blocked with all the other events. This is happening in both IE and in FireFox. In my mind the logic would be if you are in this range of numbers like all the other keys that are in that range of numbers that is blocked then you would be blocked too. But for some reason it's not blocking those.

    Another piece of code that will block the special characters including . / - is
    Code:
    <textarea rows=2 cols=20 name=comments onKeypress="if(!isNS4){if ((event.keyCode > 32 && event.keyCode < 48) || (event.keyCode > 57 && event.keyCode < 65) || (event.keyCode > 90 && event.keyCode < 97)) event.returnValue = false;}else{if ((event.which > 32 && event.which < 48) || (event.which > 57 && event.which < 65) || (event.which > 90 && event.which < 97)) return false;}"></textarea>
    So I know those 3 can be blocked.

    Any suggestions?

    Oh yeah and I got my code from
    <!-- This script and many more are available free online at -->

    <!-- The JavaScript Source!! http://javascript.internet.com -->

    <!-- Original: Jeremy Wollard (wollard@flash.net) -->

    The only problem is that the number part doesn't work out of the box, because he has a syntax error, you have to put a space between returnfalse for the non-IE browsers.

  2. #2
    SitePoint Guru
    Join Date
    Sep 2006
    Posts
    731
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Skookum
    I am trying to build a form where I block specific keys from use on the keyboard. I am able to kind of get it up and running but not completely as of yet.

    I do understand that this will only work for people that have JavaScript enabled on their browsers, I will compensate for that on the DB side.

    I have a couple of things that I need to accomplish.

    1. Allow only Alpha (Letter keys).
    2. Allow only Numeric (Number keys).
    3. Block most if not all special keys (!@#$%^&*().......)
    Far simpler to scan the content after every keypress, and delete all unwanted characters using a regular expression.
    Code:
    <input type='text' onkeyup='this.value=this.value.replace(/[^0-9a-z]/ig,"")'>

  3. #3
    SitePoint Addict Skookum's Avatar
    Join Date
    Sep 2006
    Location
    Idaho
    Posts
    375
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you so much that works perfectly.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •