CODEWITHSUNDEEP
regexhtmlemail
user9876776
user9876776

Reputation:

Input type email: limit local part max length

How I can restrict emails with local part (text before @) longer than 64 with pattern attribute?

 <input type="email" id="email" name="email"
        required="required" class="form-control">

Example: 1234567890123456789012345678901234567890123456789012345678901234+x@example.com shouldn't be accepted

Upvotes: 2

Views: 1067

Answers (1)

Wiktor Stribiżew
Wiktor Stribiżew

Reputation: 627468

In Basic validation section, MDN input docs say that

Browsers that support the "email" input type automatically provide validation to ensure that only text that matches the standard format for Internet email addresses is entered into the input box. Browsers that implement the specification should be using an algorithm equivalent to the following regular expression:

/^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@a-zA-Z0-9?(?:.a-zA-Z0-9?)*$/

You may use this pattern, or any other that meets your requirements, and add a (?![^@]{65}) lookahead at the start that will fail any input with 65 or more non-@s at the start. In an HTML5 regex, you may even remove the ^ at the start and $ at the end of the string as they are added automatically.

So, you may use

pattern="(?![^@]{65})[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*"

Upvotes: 1

Related Questions