Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 24
  1. #1
    Regular Coder
    Join Date
    Feb 2004
    Location
    Florida, USA
    Posts
    275
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Limiting characters in forms

    How can I limit what type of characters a user can type inside an input field? for instance only numbers and/or characters?

  • #2
    Regular Coder
    Join Date
    May 2004
    Location
    Minneapolis, MN, USA
    Posts
    904
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Code:
    <input type="text" name="input" id="input" maxlength="20" />

  • #3
    Regular Coder
    Join Date
    Feb 2004
    Location
    Florida, USA
    Posts
    275
    Thanks
    0
    Thanked 0 Times in 0 Posts
    thats not what I meant, I meant like only text or only numbers

  • #4
    Regular Coder
    Join Date
    Aug 2002
    Location
    USA
    Posts
    625
    Thanks
    0
    Thanked 0 Times in 0 Posts
    How can I limit what type of characters a user can type inside an input field? for instance only numbers and/or characters?

    You need to ask this in the javascript forum. Maybe, a mod will move it for you.

    You can either use regular expressions, or just create a variable containing the prohibited characters, then loop through it. Something like:

    Variable:

    var badChar = " \/+()*&^%$#?<>=!~`[]|:;,";

    Loop:

    for (j=0;j<badChar.length;j++){

    New variable to hold the bad character:

    var illChar = badChar.charAt(j);

    Conditional:

    if (document['formName']['fieldName'].value.indexOf(illChar,0) !=-1){
    alert("field contains illegal character(s)...!");
    return false;
    }
    }

    The statement will return -1, if no illegal character is found, so if one of the characters is found, !=-1 will evaluate to true, and produce an alert().


    Together:

    Code:
    var badChar = " \/+()*&^%$#?<>=!~`[]|:;,";
    for (j=0;j<badChar.length;j++){
    
    var illChar = badChar.charAt(j);
    
    if (document['formName']['fieldName'].value.indexOf(illChar,0) !=-1){
    alert("field contains illegal character(s)...!");
    return false;
    }
    }



    -james
    "God so loved the world that he gave his only begotten son, so that whosoever believed in him would not perish, but have everlasting life. For God did not send his son into the world to condemn the world, but so that through him the world might be saved. "

  • #5
    Regular Coder
    Join Date
    Feb 2004
    Location
    Florida, USA
    Posts
    275
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Sorry, I didnt think that was javascript, I'm doing the form in PHP using HTML tables and such to display it, Your solution is closer to what I wasnt, however I rather not allow those characters at all as they happen.

    ie. if a user presses a number, on a field that does not allow them, the key pressed would be ignored.

  • #6
    Regular Coder
    Join Date
    Aug 2002
    Location
    USA
    Posts
    625
    Thanks
    0
    Thanked 0 Times in 0 Posts
    ie. if a user presses a number, on a field that does not allow them, the key pressed would be ignored
    Well, I'm sure there's a better way to do it, but this works:

    Code:
    <script type="text/javascript">
    <!--
    
    
    function chkFrm(){
    var badChar = " /\\+()*&^%$#?<>=!~`[]|:;,'";
    var doc = document['oFrm']['oTxt'];
    
    for (j=0;j<badChar.length;j++){
    var illChar = badChar.charAt(j);
    if (doc.value.indexOf(illChar,0) !=-1){
    doc.value = doc.value.slice(illChar,-1);
    }
    }
    }
    
    //-->
    </script>
    
    <form name="oFrm">
    <input name="oTxt" type="text" size="15" maxlength="15" onkeydown="javascript:chkFrm();" onkeyup="javascript:chkFrm();" />
    </form>
    I added onkeydown, so that someone can't hold down the wrong key and override the functionality.

    Maybe, somebody else will chime in, and edumacate me as to the proper way...?



    -james
    Last edited by jamescover; 08-23-2004 at 12:05 AM.
    "God so loved the world that he gave his only begotten son, so that whosoever believed in him would not perish, but have everlasting life. For God did not send his son into the world to condemn the world, but so that through him the world might be saved. "

  • #7
    Regular Coder
    Join Date
    Feb 2004
    Location
    Florida, USA
    Posts
    275
    Thanks
    0
    Thanked 0 Times in 0 Posts
    hmm, that looks like it might work, I'm about to test it now, Thanks

  • #8
    Regular Coder
    Join Date
    Feb 2004
    Location
    Florida, USA
    Posts
    275
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Well, believe it or not, that didnt work for me, also I would have to create a whole function for each field, which is not good considering i have 20 somewhat fields.

  • #9
    Regular Coder
    Join Date
    Feb 2004
    Location
    Florida, USA
    Posts
    275
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I found this, but only works on IE, any ideas for netscape?

    Code:
     <script>
      function filterInput(e) {
       // Get the regular expression to test against for this particular object
       regAllow = (e)?eval(e.allow):eval(event.srcElement.allow);
       // Check for an allowed character, if not found, cancel the keypress's event bubbling
       if (!String.fromCharCode(event.keyCode).match(regAllow)) event.returnValue=false;
      }
     </script>

  • #10
    Regular Coder
    Join Date
    Aug 2002
    Location
    USA
    Posts
    625
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Well, believe it or not, that didnt work for me, also I would have to create a whole function for each field, which is not good considering i have 20 somewhat fields.
    You didn't say what didn't work, i.e., js errors, etc., or what browser it didn't work in. I tested it (and it worked) in IE6.0 & Firefox/0.9.3

    Well, believe it or not, that didnt work for me, also I would have to create a whole function for each field, which is not good considering i have 20 somewhat fields.
    You've didn't previously indicate how many fields you would be using.

    How can I limit what type of characters a user can type inside an input field? for instance only numbers and/or characters?

    You can loop through all form fields, type "text", checking for illegal characters.



    -james
    "God so loved the world that he gave his only begotten son, so that whosoever believed in him would not perish, but have everlasting life. For God did not send his son into the world to condemn the world, but so that through him the world might be saved. "

  • #11
    Regular Coder
    Join Date
    Aug 2002
    Location
    USA
    Posts
    625
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I found this, but only works on IE, any ideas for netscape?
    What version of NS?

    The last time I did this (js 1.2/3), you had to test for the event, and capture it:


    Something like:

    captureEvents(eventType)

    event.which ==


    -james
    "God so loved the world that he gave his only begotten son, so that whosoever believed in him would not perish, but have everlasting life. For God did not send his son into the world to condemn the world, but so that through him the world might be saved. "

  • #12
    Banned
    Join Date
    Sep 2003
    Posts
    3,620
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Try this:

    Code:
    <script type="text/javascript">
      function check(input){
        if(input.value.match(/\W+/g)){
           alert('You may only enter a-z, A-Z or 0-9 in this field!');
           input.value = input.value.replace(/[^\w]*/g,'');
           input.focus();
        }  
      }
    </script>
    </head>
    
    <body>
    <form>
    <input type="text" onkeyup="check(this)" onchange="check(this)">
    </form>
    .....Willy

    Edit: Added input.onfocus() to the function to return focus to the correct field if the onchage event was fired....
    Last edited by Willy Duitt; 08-24-2004 at 07:07 AM.

  • #13
    Regular Coder
    Join Date
    May 2004
    Location
    Minneapolis, MN, USA
    Posts
    904
    Thanks
    0
    Thanked 0 Times in 0 Posts
    (D'oh! Wasn't paying attention... ;p)

  • #14
    Regular Coder
    Join Date
    Aug 2002
    Location
    USA
    Posts
    625
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Code:
    <script type="text/javascript">
      function check(input){
        if(input.value.match(/\W+/g)){
           alert('You may enter a-z, A-Z or 0-9 in this field!');
           input.value = input.value.replace(/[^\w]*/g,'');
        }  
      }
    </script>
    </head>
    
    <body>
    <form>
    <input type="text" onkeyup="check(this)" onchange="check(this)">
    </form>

    bravo
    "God so loved the world that he gave his only begotten son, so that whosoever believed in him would not perish, but have everlasting life. For God did not send his son into the world to condemn the world, but so that through him the world might be saved. "

  • #15
    Regular Coder
    Join Date
    Feb 2004
    Location
    Florida, USA
    Posts
    275
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Sorry jamescover, Ive been rather absent minded lately working long days to get this site finnished. The script Willy Duitt posted works awesome, but how could I change values I want to allow?

    I need ones to only allow
    0-9 " "(space) and "-"
    and some only to allow numbers,

    I'm sorry if this is something I should know, I just have more of a feel for PHP and even there I cant say I know alot.

    Thanks for your patience, I should try to get a good long sleep tonight.


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

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