jQuery to prevent user from inputting if regular expression is not matched by using preventdefault

Question

Every time user enter, value is checked with regular expression, I'm trying to restrict user from entering further into input field if regexp is not matched

Using keyup event, preventdefault never fires and using keypress event, user is unable to input at all because in the begining, value in input field shows as "" (nothing)

var discountRegex = /(^100([.]0{1,2})?)$|(^\d{1,2}([.]\d{1,2})?)$/
            $("#" + (idOfElement)).on("keyup",function (e) {

                var val=this.value
                var k = e.keyCode
                if(k==46 ||(k > 48 && k <97)){
                    console.log(k)
                    return discountRegex.test(val);
                }

            });

in the above code idOfElement is the id i get on whichever field i focus.

Marco Moretti · Answer 1 · 2020-02-04T10:13:02.673

0

You can check if the regex is matched and if not you can remove the last char like the example below

I updated the code with keydown example

Example

edited Feb 04 '20 at 10:13

answered Feb 04 '20 at 09:45

Marco Moretti

689
4
11

is there no way to cancel the event like we can do for keyPress? – Ankita Gupta Feb 04 '20 at 09:58
I updated the code. You get get char from keycode with the function String.fromCharCode and than return the result of regex – Marco Moretti Feb 04 '20 at 10:11
the above code accepts special character also, please help me the code – Ankita Gupta Feb 04 '20 at 11:22
you can use keypress and remove if with key evaluation. Why have you added this statement? – Marco Moretti Feb 04 '20 at 11:29
Because it doesn't work out in either way, i tried with keypress and keyup too – Ankita Gupta Feb 04 '20 at 11:34
Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/207200/discussion-between-ankita-gupta-and-marco-moretti). – Ankita Gupta Feb 04 '20 at 16:01

score 0 · Answer 2 · answered Feb 04 '20 at 10:10

0

Please refer sample code. If input key is invalid input will not accept it. Also please find fiddle for same in comment.

<input type="text">


$(document).ready(function(){
  $("input").bind('keypress', function(e) {
  var str = e.keyCode;
  if (/(^100([.]0{1,2})?)$|(^\d{1,2}([.]\d{1,2})?)$/.test(str)) {
          alert('Invalid')
       e.preventDefault();
    } else {
       alert('Valid');
    }
});
});

answered Feb 04 '20 at 10:10

Shiv Patne

543
3
10

Fiddle link for my answer https://jsfiddle.net/shivpatne/gpx3f6Lu – Shiv Patne Feb 04 '20 at 10:10
the above regex is for value less than 100 and can only accept upto 2 decimal poit – Ankita Gupta Feb 04 '20 at 10:30
You can replace it with required regex – Shiv Patne Feb 04 '20 at 10:33
Do you need help with regex accepting value less than 100 and upto 2 decimal pt.? – Shiv Patne Feb 04 '20 at 10:36

jQuery to prevent user from inputting if regular expression is not matched by using preventdefault

2 Answers2