How can I set the maximum length of 6 and minimum length of 6 in a textbox

Question

Consider    lt input id  quot groupidtext quot  type  quot text quot  style  quot width  100px  quot  maxlength  quot 6 quot    gt  lt  td gt   Is there a way to set the minimum length to 6

User · Answer

You can use the HTML5 pattern attribute or use JavaScript.

The pattern could look for example like this:

<input id="groupidtext" type="text" pattern="(.){6,6}" style="width: 100px;" maxlength="6" />

But the pattern attribute will only work with HTML5 browsers. For old browsers you'll need JavaScript.

As suggested in the comments to add, this will only work as soon as a form is about to be submitted. If this input is not in a form and you need validation as a user types, use JavaScript.

User · Answer

You could do it with JavaScript with something like this   lt input onblur  quot checkLength this  quot  id  quot groupidtext quot  type  quot text quot  style  quot width  100px  quot  maxlength  quot 6 quot    gt   lt  -- Or use event onkeyup instead if you want to check every character strike -- gt   function checkLength el      if  el value length    6        alert  quot length must be exactly 6 characters quot          Note this would work in older browsers which don t support HTML 5  but it relies on the user having JavaScript switched on

User · Answer

You can t set a minimum length on a text field  Otherwise  users wouldn t be able to type in the first five characters  Your best bet is to validate the input when the form is submitted to ensure that the length is six  maxlength is not a validation attribute  It is designed to prevent the user from physically typing in more than six characters  The corresponding minlengh is not in scope of the HTML specification  because its implementation would render the textbox unusable

User · Answer

You can find the answer here  Is there a minlength validation attribute in HTML5  Therefore this should do the job   lt input pattern  quot   6 6  quot  gt

User · Answer

Addition to Alex  answer  JavaScript   function            input type  quot submit quot     prop  disabled   true           check   on  input   function e            if this value length     6                   input type  quot submit quot     prop  disabled   false             else                  input type  quot submit quot     prop  disabled   true                          HTML  lt input type  quot text quot  maxlength  quot 6 quot  id  quot check quot  data-minlength  quot 6 quot    gt  lt br   gt   lt input type  quot submit quot  value  quot send quot    gt   JsFiddle But  You should always remember to validate the user input on the server side again  The user could modify the local HTML or disable JavaScript

[javascript] How can I set the maximum length of 6 and minimum length of 6 in a textbox?

Examples related to javascript

Examples related to jquery

Examples related to html