0

I have a textbox where I want only allowed up to 11 digits, an optional comma, and two more digits after it. Anything else should not be rendered when the key is pressed into the textbox:

$('#txt').keypress(function (e) {
  var code = e.which;
  var key = String.fromCharCode(code);
  // REGEX TO AVOID CHARS & A DOT (.)
  var pattern = /[a-zA-Z]|\./g;
  var isMatch = pattern.test(key);
  if (isMatch) {
    // DO NOT RENDER CHARS & dot
    e.preventDefault();
  }
});

The above code works when an invalid key is pressed, such as a char or a dot, but does not ensure only one comma and only 2 digits afterwards.

This must match:

12314
123123,44

This must not:

12313,6666

Here is a demo.

UPDATE: Any digit except numbers and comma must be avoided, so the regex I proposed is not valid since only prevents dots (.).

anmarti
  • 5,045
  • 10
  • 55
  • 96

2 Answers2

3

You should test your complete string, not only the current letter.

$('#txt').keypress(function (e) {
    var key = String.fromCharCode(e.which);
    var pattern=/^[0-9]{1,11}(,[0-9]{0,2})?$/;

    // test this
    var txt = $(this).val() + key;

    if (!pattern.test(txt)) {
        e.preventDefault();
    }
});

​

jsfiddle example

glkz
  • 101
  • 3
  • Moreover I can put this code on a function and call it on client click. This way I prevent the copy-paste @Koby says further down. – anmarti Nov 21 '12 at 12:17
2

This regex will match any string containing 1 up to 11 digits optionally followed by a , and exactly 2 more digits: ^[0-9]{1,11}(,[0-9]{2})?$

Explanation:

^             # Match the start of the string
[0-9]{1,11}   # Followed by a maximum of 11 digits
(,[0-9]{2})?  # Optionally followed by a comma and 2 more digits 
$             # Followed by the end of the string

See it in action here.

Chris Seymour
  • 83,387
  • 30
  • 160
  • 202
  • 1
    The comma is not matched and I'm able to enter more than 11 digits. http://jsfiddle.net/d2mRk/14/ – anmarti Nov 21 '12 at 11:06
  • please not I want a javascript regex, not a ruby one. – anmarti Nov 21 '12 at 11:12
  • The `regex` matches your criteria, not a `javascript` guy so not sure what is wrong in this context. Ruby isn't relevant it's just the demo site this is only `ERE`. – Chris Seymour Nov 21 '12 at 11:13
  • @senyortoni It actually is matched, but a regex that matches a string as it's being built, and a regex that matches the final string are two different things. It will match `11,22` but not `11,` thus the `,` is blocked. – Corbin Nov 21 '12 at 11:17
  • 4
    This regex is the same in javascript and ruby. @senyortoni - You are suggesting the `123,` is a valid input, because you do validation while typing. By the way: validation while typing that block keys is a very poor choice - the user can still paste text, drag it, delete parts of it, etc. Also - your code is very wrong, you use the pattern on a key - a single character at each step - not the whole text. – Kobi Nov 21 '12 at 11:18
  • @sudo_o - You probably want the `$` out of the parentheses: `^[0-9]{1,11}(,[0-9]{0,2})?$` – Kobi Nov 21 '12 at 11:20
  • You may be right @kobi I should allow type anything and check de regex in the onlick event or what do you propose? – anmarti Nov 21 '12 at 11:21
  • @senyortoni - I'd strongly recommend the jquery validation plugin. – Kobi Nov 21 '12 at 11:22
  • @Kobi those two regex are functionally equivalent. (Though I do think that your version is clearer, and the one used 99.9% of the time.) – Corbin Nov 21 '12 at 11:23
  • @Corbin - Not really. `^a(b|$)` would validate `"ab!@#$%^"` - the end is not anchored. – Kobi Nov 21 '12 at 11:24
  • @Kobi Whoops. Not the same thing at all... Seems that it's about sleep time for me >.<. – Corbin Nov 21 '12 at 11:33