Not allow initial spaces on input

Question

I need to deny initial spaces on my input (which is not in a form), I have code like this:

<input id="customer-name" class="required no-spaces" minlength="3"  />

And this is my javascript function:

$(".no-spaces").on('keypress', function(e) {
     if (e.which == 32) {
         return false;
     }
});

But this doesn't allow spaces in any part of the input. How to do it just before any text?

Edit: The real is that I'm doing an autocomplete with the input and, If i allow initial spaces it will return all data.

`if (this.value == "" && e.which == 32) e.preventDefault()`? — Bergi, May 16 '14 at 16:09
Why don't you just remove initial spaces when processing the input? — Barmar, May 16 '14 at 16:19

score 1 · Answer 1 · edited May 23 '17 at 10:25

1

Verify if the string is empty beforehand.

$(".no-spaces").on('keypress', function(e) {
     if ($(this).val() == "" && e.which == 32) {
         return false;
     }
});

Also, check this in order to prevent the case where the user selects the entire text and then presses space and this to check if the cursor is indeed at the beggining of the input (Thanks to Barmar for mentioning this specific case)

edited May 23 '17 at 10:25

Community

1
1

answered May 16 '14 at 16:11

William Barbosa

4,936
2
19
37

1

Much better more efficient than the other two which will trim or evaluate a regex every time a space is pressed. +1 – Sam May 16 '14 at 16:12
1

This won't stop them from moving the cursor to the beginning of a non-empty input and inserting a space. – Barmar May 16 '14 at 16:16
Added the reference to input.js, which will help him cover this case as well. Thanks @Barmar – William Barbosa May 16 '14 at 16:34
@Sam: How is that "better"? It just does less… – Bergi May 16 '14 at 16:38

Arkar Aung · Answer 2 · 2014-05-16T16:49:40.937

1

Just simply check there is another character on textbox.

$(".no-spaces").on('keypress', function(e) {
     if (e.which == 32 && ($this).val() == '') {
         return false;
     }
});

Edit

I hope it might be work.

$(".no-spaces").on('keypress', function(e) {
     $(this).val(function(i, v) {
        if (v[0] == ' ') {
            return v.slice(1, v.length);
        };
        return v;
     });
});

edited May 16 '14 at 16:49

answered May 16 '14 at 16:12

Arkar Aung

3,554
1
16
25

Since this is the same as William Barbosa's answer, my comment there applies. – Barmar May 16 '14 at 16:17
I like your edit, but I think you'll still be able to copy/paste multiple spaces..I think you may want to make this recursively check `v[0]` and removing spaces until there isn't anymore. – Sam May 16 '14 at 16:52

score 0 · Answer 3 · answered May 16 '14 at 16:10

0

$(".no-spaces").on('keypress', function(e) {
     if (e.which == 32) {
         $(this).val($(this).val().replace(/^\W*/, ''));
     }
});

answered May 16 '14 at 16:10

Dan Smolinske

319
3
7

score 0 · Answer 4 · answered May 16 '14 at 20:52

0

This works for me.

$(".no-spaces").on('keypress', function(e) {
     var val = $(this).val();
     val_ltrim = ltrim(val);
     $(this).val(val_ltrim);
});

Greetings.

answered May 16 '14 at 20:52

Jhonatan Sandoval

1,283
6
24
40

Not allow initial spaces on input

4 Answers4