JS only alpha numeric and spaces on keyup

Question

I want to limit input to letters numbers and spaces.

And I want it to run on keyup so the user sees other characters being rejected. In other words, I don't want the illegal characters to remain in the field and only get deleted after submission.

I tried this...

$('#custName').keyup(function() {
    $(this).val($(this).val().match(/^[\w\s]+$/));
});

Fiddle

But as soon as an illegal character is entered, the whole string is deleted.

How can I prevent illegal character as it is entered, while keeping the legal ones?

Answer 1

.match() is returning either:

• An array of strings (just one in your existing code) in case of a match: in your case -- by luck -- it was coerced to a string, so it seemed to work as expected
• null in case of no match: that's why the entire input was lost

What you need is more like:

$('#custName').keyup(function() {
    $(this).val($(this).val().replace(/[^\w\s]+/g, ''));
});

As noticed by Hanlet, another potential issue with this approach is that some browsers will fire a keyup event for non printable characters. So, you may have to filter them with a test on event.keyCode.

Answer 2

Validation for name // will accept alphabets and space and backspace

$('.nameonly').on('keydown', function(e){
    if ((e.which < 65 &&  e.which != 32 && e.which != 8) || e.which > 90 ) {
        return false;
    }
});