2
function test() {
    var regex = new RegExp("^[0-9]{1,11}$");
    var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
    if (!regex.test(key)) {
        event.preventDefault();
        return false;
    }
}

It is correct to take only integer but max-length is not working. It takes more than 11 digits.

Titti Towel
  • 121
  • 3
  • 11
  • 2
    What exactly you are trying to achieve? – Satpal Dec 08 '16 at 12:58
  • 4
    You're passing it a single character, which satisfies `{1,11}`. –  Dec 08 '16 at 12:59
  • 2
    This is a frequent question, the reson is that you test a single char against the regex. You need to use `maxlength` attribute. You may also add an `pattern="\d{1,11}"` attribute to check the input validity on submit. – Wiktor Stribiżew Dec 08 '16 at 12:59
  • I want to give permission only to write digits and max length should be eleven(11) digits. – Titti Towel Dec 08 '16 at 13:00
  • so how to make it to take maximum 11 digits – Titti Towel Dec 08 '16 at 13:02
  • If you want to control input into an input element, use the `pattern` attribute, which has multiple advantages, including the ability to style the input with CSS rules such as `input:invalid`. –  Dec 08 '16 at 13:02
  • 1
    You need to test the entire value, rather than just the single char from the key event. – ne1410s Dec 08 '16 at 13:03
  • no I want to check single digit because it will not let the user to write against the rule in the text box. If I want to check a string then user can write all string first then this string will be tested...? – Titti Towel Dec 08 '16 at 13:06
  • Well, you can't detect the overall length from a single digit. What event are you calling this test routine on? –  Dec 08 '16 at 13:10
  • Actually I am using onkeypress – Titti Towel Dec 08 '16 at 13:14

3 Answers3

1

This kind of manual input validation is not how applications are usually written these days in HTML5. It is a throwback to the bad old jQuery days. It is a bad user experience to simply throw away keystrokes--the user has no idea what he is doing wrong, and may think his keyboard is broken. If you trap on the keyup event, you will also miss some scenarios, such as when the user has dragged and dropped text into the input box. Or if the user types CTRL+V to paste text into the box, you will end up looking at that keystroke instead of the characters pasted in.

HTML5 adds the pattern attribute to the input element which allows you to do regexp-based validation. This has a number of advantages. For instance, invalid entries can be styled using CSS with the :invalid pseudo-class. Invalid form entries will automatically prevent submits, and put up user-friendly balloons describing the specific problem.

In your case:

<input pattern="\\d{1, 11}">

Note that no ^ or $ anchors are required--they are implicit in this case.

No JS is required.

0

as you said:

I want to give permission only to write digits and max length should be eleven(11) digits.

you can:

  1. use an <input type="number" maxlength="11" />
  2. use a regex /^\d{1,11}$/

document.addEventListener('DOMContentLoaded', function() {
function valueIsValid(v) {

  return /^\d{1,11}$/.test(v);
}
  var foo = document.querySelector('#foo');

foo
  .addEventListener('change', function() {
    console.log('valid', valueIsValid(foo.value), foo.value)
  })
;
});
<input id="foo" />
Hitmands
  • 13,491
  • 4
  • 34
  • 69
0

This is what I understood from your question. Try something like this.

var count = 0;

function test() {
    var regex = new RegExp("^[0-9]{1,11}$");
    var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);

   if(count<11){
    if (!regex.test(key)) {
        count=0;
        event.preventDefault();
        return false;
    }
     count++;
   }
   return false;   
}
Andy
  • 521
  • 3
  • 6
  • 22