SitePoint Sponsor

User Tag List

Results 1 to 10 of 10
  1. #1
    SitePoint Addict TegSkywalker's Avatar
    Join Date
    Nov 2001
    Location
    USA
    Posts
    214
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Disabling spaces/spacebar in a form textfield

    Say I have a textbox in a form that I do not want the user to have the ability to put any spaces. This example is for someone's name converting to a short url so no matter what, their name is like JohnDoe and during the typing of it, the user cannot put a space between their name. Is this an HTML or Javascript thing to pretty much disable spacebar just for that field?

  2. #2
    SitePoint Wizard bronze trophy
    Join Date
    Jul 2008
    Posts
    5,757
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It's a serverside validation/sanitization thing.

    Have you considered all the other characters which may not be allowed or may have special meaning in a url? You might consider making a whitelist of allowed characters.

    After you have completed the serverside code, you can optionally add some javascript to give immediate feedback in case the user enters an invalid character.

  3. #3
    SitePoint Addict TegSkywalker's Avatar
    Join Date
    Nov 2001
    Location
    USA
    Posts
    214
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    isnt there a jQuery function or addon?

  4. #4
    SitePoint Enthusiast Panda Coder's Avatar
    Join Date
    Nov 2005
    Location
    Tarifa, Spain
    Posts
    25
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    you could use a function triggered onKeyUp to replace the spaces in the textbox like onkeyup="strip_spaces();"

    very roughly in the function:
    textbox_variable.replace(" ", "");

    I'm sure I have used it before somewhere...

  5. #5
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,872
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    replace(/\s/g, "");

    would work better as it will remove all the whitespace characters and not just those entered using the spacebar.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  6. #6
    SitePoint Addict TegSkywalker's Avatar
    Join Date
    Nov 2001
    Location
    USA
    Posts
    214
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by felgall View Post
    replace(/\s/g, "");

    would work better as it will remove all the whitespace characters and not just those entered using the spacebar.
    Did you want me to do that in javascript or php? I'm basically using this code from the jquery_twitter script and the jquery validate:

    Code:
    <label for="username">Personal URL:<input type="text" id="username" name="username" onkeyup="ucheck.updateUrl(this.value)" style="width:200px; margin-left:36px;" validate="required:true">

  7. #7
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,872
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by TegSkywalker View Post
    Did you want me to do that in javascript or php?
    Whatever you do for form validation has to be done in the PHP. You then duplicate as much of that as is useful in JavaScript for those who have it enabled so as to avoid the need to submit the form in order to find the errors when possible.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  8. #8
    SitePoint Member
    Join Date
    Nov 2009
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    nice!

  9. #9
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    1
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Incase anyone else needs this:

    HTML Code:
    $('input.nospace').keydown(function(e) {
        if (e.keyCode == 32) {
            return false;
        }
    });

  10. #10
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    1
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    How would I implement this on my site? Should I just put the following code in wrapped in script tags in my header? Thanks in advance!!!

    Quote Originally Posted by DevTrail View Post
    Incase anyone else needs this:

    HTML Code:
    $('input.nospace').keydown(function(e) {
        if (e.keyCode == 32) {
            return false;
        }
    });


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
  •