1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Numbers and Letters only in an input (validation).

Discussion in 'JavaScript' started by MrLeN, Dec 13, 2010.

  1. #1
    I have a CMS I made in PHP, and when I give it to users they create dodgy page names with # and ? and ! etc. I create the file name from the page name.
    SEMrush
    ie: Hello There becomes hello-there.php

    But if someone makes a page: #My Page!

    ..it gets real confusing to handle.

    I want to allow people to use only numbers letters, as well as " and '

    ..and that's all. I will allow " and ' because they are common for titles.

    How can I prevent people from typing anything but
    letters
    numbers
    '
    "

    I found a script online that allows only letters. I found another one (with totally different coding) that allows only numbers. I tried to join them together, but it was doing my head in, and I hadn't even got to allowing ' and " yet.

    Is there anyone here that actually knows javascript and can show me how to allow only:

    numbers
    letters
    '
    "


    ...in an input field?
     
    MrLeN, Dec 13, 2010 IP
    SEMrush
  2. shofstetter

    shofstetter Active Member

    Messages:
    177
    Likes Received:
    6
    Best Answers:
    1
    Trophy Points:
    70
    #2
    you could use str_replace() to clean the filenames ex:

    function clean_name($name){
    $name = str_replace("#","",$name); //this will remove '#'
    $name = str_replace("&","and",$name); //this will replace & with the word 'and'
    $name = str_replace("*","",$name);//you just have to keep going removing anything you don't want
    //and when you get to the end retun the "cleaned" name

    return $name;
    }
     
    shofstetter, Dec 13, 2010 IP
  3. MrLeN

    MrLeN Active Member

    Messages:
    399
    Likes Received:
    7
    Best Answers:
    0
    Trophy Points:
    70
    #3
    Yeah, I suppose I could, or use ereg_replace, which is what I usually use to take stuff out.

    But the script is so complicated now with so many things happening, if I have to force one more bit of PHP into the script it's going to burst at the seams.

    I just figured it's just as easy to prevent people from typing certain characters in the first place and be done with it.
     
    MrLeN, Dec 13, 2010 IP
  4. shofstetter

    shofstetter Active Member

    Messages:
    177
    Likes Received:
    6
    Best Answers:
    1
    Trophy Points:
    70
    #4
    you could test it with javascript using regexp.test() but you should also test it on the server just to be safe


    var str = document.getElementById('filename').value;
    var reg = new RegExp("[^a-zA-Z0-9]");
    if (reg.test(str)){
    alert("Only letters and number are allowed);
    }else{
    alert("string contains only letters and numbers:)");
    }
     
    shofstetter, Dec 13, 2010 IP
  5. MrLeN

    MrLeN Active Member

    Messages:
    399
    Likes Received:
    7
    Best Answers:
    0
    Trophy Points:
    70
    #5
    I don't undersand any of the above (at all) :)
     
    MrLeN, Dec 13, 2010 IP
  6. shofstetter

    shofstetter Active Member

    Messages:
    177
    Likes Received:
    6
    Best Answers:
    1
    Trophy Points:
    70
    #6
    Here I have tried to comment my javascript. I am not very good with regular expressions so you may need someone to check the expression : [^a-zA-Z0-9] to make sure it is correct. basically it just checks to see if the user entered anything other than letters or numbers into a form field with the id of filename. it pops up a message box either way with a different message depending on the result of the test.


    
    var str = document.getElementById('filename').value;  //get the value from an input text box with id="filename"
    var reg = new RegExp("[^a-zA-Z0-9]"); //a regular expression to see if a string contains anything but letters and/or numbers
    if (reg.test(str)){   //test the input string against the regular expression
    alert("Only letters and number are allowed);  //if we found anything but letters and numbers popup a box and complain
    }else{
    alert("string contains only letters and numbers"); //if we didn't find anything other than letters and numbers popup a box and say everything is all good
    } 
    
    Code (markup):
     
    shofstetter, Dec 13, 2010 IP
  7. MrLeN

    MrLeN Active Member

    Messages:
    399
    Likes Received:
    7
    Best Answers:
    0
    Trophy Points:
    70
    #7
    Ok I have 2 questions:

    1). How can I add " and ' to the regular expressions?
    2). How does that get called? ie:

    
    <script type="JavaScript">
    [color=red]Does it go in here?[/color]
    </script>
    <input type="text"> [color=red]What do I put in there to call it?[/color]
    
    Code (markup):
     
    MrLeN, Dec 13, 2010 IP
  8. olddocks

    olddocks Notable Member

    Messages:
    3,275
    Likes Received:
    165
    Best Answers:
    0
    Trophy Points:
    215
    #8
    here is simple and efficient way to clean up the input.
    The regular expression will only allow a-z and 0-9.

    
    function Check(){
    var regex='/^[0-9a-zA-Z\s]+$/';
    var data = 'this is garbage $%7**';
    if(regex.test(data)){
    alert("Good")
    return true;
    } else {
    alert("Bad")
    return false;
    }
    }
    
    Code (markup):
     
    olddocks, Dec 13, 2010 IP
  9. shofstetter

    shofstetter Active Member

    Messages:
    177
    Likes Received:
    6
    Best Answers:
    1
    Trophy Points:
    70
    #9
    Sorry for the late response had to head home for the day: the code below includes a function that lets you pick char's that are not allowed I think this will be the simplest clients side validator for you. it allows " and '

    
    <html>
    <head>
    <script language="javascript">
    
    function validate_input(data){
       var iChars = "!@#$%^&*()+=-[]\\;,./{}|:<>?~_"; /* characters not allowed  */
       for (var i = 0; i < data.length; i++) {
      	if (iChars.indexOf(data.charAt(i)) != -1) {
      	  alert ("Your filename has special characters. \nThese are not allowed.");
      	return false;
      	}
      }
      if(data.length < 1){
      alert("File Name is required");
    	return false;
      }
    
    }
    
    </script>
    
    </head>
    
    <body>
    <form action="#" method="Get" onSubmit="return validate_input(document.getElementById('filename').value);">
    <input type="text" id="filename" name="filename">
    <input type="submit">
    </form>
    </body>
    </html>
    
    Code (markup):
     
    Last edited: Dec 13, 2010
    shofstetter, Dec 13, 2010 IP
  10. MrLeN

    MrLeN Active Member

    Messages:
    399
    Likes Received:
    7
    Best Answers:
    0
    Trophy Points:
    70
    #10
    shofstetter, Thanks heaps mate. I appreciate your help very much! I will use that script. Thanks for laying it out exactly, because I get confused really easy with programming stuff (especially javascript). I am not "too" bad with PHP. The JavaScriptworks very well now! Thanks for laying it out in an easy to understand way!
     
    MrLeN, Dec 13, 2010 IP