prevent white space in first position in a textbox

Question

My code is working great when the user input first character as a white space but if user insert a string and come back to first position then it take white space. How I prevent user to do this ? "#M1_7_othe" this is the id of input box.

$(function(){    
    var pp;    

    $("#M1_7_other").keydown(function(event) {
        pp =$("#M1_7_other").val();
        if( ($("#M1_7_other").val().length) == 0 ) {
            if( event.keyCode == 32 ) {
                return false;
            }
        }
    });
});

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

4

This doesn't prevent it but it delets the whitespace. Use trim() for deleting the whitespace in front and at the end

var str = "       Hello World!        ";
alert(str.trim());

And the output will be:

Hello World!

IE9, IE8:

Look at this topic:

.trim() in JavaScript not working in IE

edited May 23 '17 at 10:25

Community

1
1

answered May 14 '14 at 12:25

Aerox

69
3

1

The user gets more input freedom, the developer gets the needed value. Win-win, what more could you need? :) – Flater May 14 '14 at 12:34
1

Worth mentioning this doesn't work [< IE9](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/Trim) – CodingIntrigue May 14 '14 at 12:35
2

This would also trim space(s) at end of string – A. Wolff May 14 '14 at 12:40
@A.Wolff yes! that is what i wrote in my answer. – Aerox May 14 '14 at 12:41
@Aerox Sorry, didn't saw it – A. Wolff May 14 '14 at 12:42

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

You could use oninput event instead, which will handle string pasted from context menu too:

$(function () {
    $("#M1_7_other").on('input', function (event) {
        var posCaret = this.selectionStart;
        this.value = this.value.replace(/^\s+/, '');
        setCaretPosition(this, posCaret);
    });
});

Here is the setCaretPosition() method, from HERE:

function setCaretPosition(elem, caretPos) {
    if(elem != null) {
        if(elem.createTextRange) {
            var range = elem.createTextRange();
            range.move('character', caretPos);
            range.select();
        }
        else {
            if(elem.selectionStart) {
                elem.focus();
                elem.setSelectionRange(caretPos, caretPos);
            }
            else
                elem.focus();
        }
    }
}

--DEMO--

score 1 · Answer 3 · answered May 14 '14 at 12:40

Please try this,

    $(function(){    
    var pp;    

    $("#M1_7_other").keydown(function(event) {
        pp =$("#M1_7_other").val();          
            if( event.keyCode == 32 && document.getElementById("M1_7_other").selectionStart === 0) {

                return false;
            }
    });
});

score 0 · Answer 4 · answered May 15 '14 at 07:55

My code is Dynamic which works on all textbox and it works on all browser including Internet Explorer try this.

    $(function(){
    var pp;
    $("input:text").keydown(function(event){

    if(($(this).val().length)==0 && event.keyCode==32)
    {
    return false;
    }
   })
    .keyup(function(event)
   {
    pp = $(this).val();
    if(pp.charAt(0)==' ')
   {
   var pbb = $.trim(pp);
   $(this).val(pbb);
   }
    });
    });

prevent white space in first position in a textbox

4 Answers4

--DEMO--