Open In App

How to specify minimum &maximum number of characters allowed in an input field in HTML ?

Improve
Improve
Like Article
Like
Save
Share
Report

In this article, we will learn how to specify the minimum and maximum of characters allowed in an input field in HTML. Given an input field the task is to set the minimum/maximum number of characters allowed in an input field in HTML.

To set the maximum character limit in the input field, we use <input> maxlength attribute. This attribute is used to specify the maximum number of characters entered into the <input> element.

To set the minimum character limit in the input field, we use <input> minlength attribute. This attribute is used to specify the minimum number of characters entered into the <input> element.

Syntax: 

<input maxlength="number1">
<input minlength="number2">

Attribute Value: 

  • number1: It contains a single value number which allows the maximum number of characters in <input> element. Its default value is 524288.
  • number2: The minimum number of characters required in input fields.

Example 1: We will set the limit of a maximum number of characters allowed in input fields.

HTML




<!DOCTYPE html>
<html>
 
<head>
    <style>
        body {
            text-align: center;
        }
        h1 {
            color: green;
        }
    </style>
</head>
<body>
    <h1>GeeksforGeeks</h1>
    <h3>
        How to specify the maximum number
        of characters <br>allowed in an
        input field in HTML?
    </h3>
    <form action="#">
        Username:
        <input type="text"
               name="username"
               maxlength="12">
          <br><br>
        Password:
        <input type="password"
               name="password"
               maxlength="10">
          <br><br>
        <input type="submit"
               value="Submit">
    </form>
</body>
 
</html>


Output: 

frt

Example 2: we will set the limit of the maximum & minimum number of characters allowed in input fields.

HTML




<!DOCTYPE html>
<html>
<head>
    <style>
        body {
            text-align: center;
        }
        h1 {
            color: green;
        }
    </style>
</head>
<body>
    <h1>
          GeeksforGeeks
      </h1>
    <h3>
        How to specify the maximum & minimum number
        of characters <br>allowed in an
        input field in HTML?
    </h3>
    <form action="#">
        Username:
        <input type="text"
               name="username"
               minlength="12"
               maxlength="20"><br><br>
        Password:
        <input type="password"
               name="password"
               minlength="10"
               maxlength="20">
          <br><br>
        <input type="submit" value="Submit">
    </form>
</body>
 
</html>


Output:



Last Updated : 12 Jan, 2024
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads