How to make mandatory for the user to enter only alphanumeric values in Jquery

Question

I have a input type in which i want to prevent the user only to enter alphanumeric values like A-a and 0-9.

I have done this :

$('.name_list').live('keypress', function (event) {
        var regex = new RegExp("^[a-zA-Z0-9\b]+$");
        var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
        if (!regex.test(key)) {
            event.preventDefault();
            return false;
        }
    });

In this i am facing issue that tab ,right,left and delete keys are not working .What more i have to add in this please help me in this .

Updated Code

$('.name_list').live('keypress', function (event) {
        var regex = new RegExp("^[a-zA-Z0-9\b]+$");
        var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
        var charCode = (event.which) ? event.which : event.keyCode;
        var Enteted = String.fromCharCode(event.which).toLowerCase();
        if (charCode != 9 && (charCode != 37 || Enteted !='%') && charCode!=39 && charCode != 46 && !regex.test(key)) {
            event.preventDefault();
            return false;
        }
    });

In this i am facing issue that it is allowing % to be entered .

http://stackoverflow.com/q/11532982/20126 http://stackoverflow.com/q/21280482/20126 — Amr Elgarhy, Nov 07 '14 at 11:32

score 0 · Answer 1 · answered Nov 07 '14 at 11:31

0

jQuery validate plugin

jQuery.validator.addMethod("alphanumeric", function(value, element) {
        return this.optional(element) || /^[a-zA-Z0-9]+$/.test(value);
});

answered Nov 07 '14 at 11:31

brandelizer

342
3
17

score 0 · Accepted Answer · answered Nov 07 '14 at 11:32

0

Because you are using this condition:

if (!regex.test(key)) {
   //...
}

You need to use this condition to check, is they the tab, left arrow, right arrow or delete buttons.

if (key !== 9 && key != 37 && key!=39 && key != 46 && !regex.test(key)) {

answered Nov 07 '14 at 11:32

vaso123

12,347
4
34
64

i have updated the code please check it is allowing % on key press – Developer Nov 07 '14 at 12:38
how we can handle this % – Developer Nov 07 '14 at 12:44
Yes, use 8 instead of 46. – vaso123 Nov 07 '14 at 12:44
still the same issue it is allowing % – Developer Nov 07 '14 at 12:47
Don't know why... % is from shift = 16, and 53 – vaso123 Nov 07 '14 at 13:10

How to make mandatory for the user to enter only alphanumeric values in Jquery

2 Answers2