Validate Name Form

Question

I have a question with validation of Html5, I have little knowledge with regex need to validate a form that get only:

• Uppercase and minuscule letters, with accents and etc;
• Whitespace;
• Can’t accept white space only;

Follows the code:

<input type="text" name="nome" placeholder="Nome" minlength="4" pattern="[a-z\s]+$" required /> 

I’m using this code but the pattern not working.

Answer 1

<input type="text" required name="full_name" pattern="^[^-\s][a-zA-ZÀ-ú ]*">

The required makes the field mandatory. In regex I don’t allow anything to start with space.

Answer 2

The following code will allow at least 2 characters and maximum 20 characters and not allow blank:

<input type="text" name="nome" placeholder="Nome" pattern="^[a-zA-Z][a-zA-Z0-9-_\.]{1,20}$" required>

If you don’t want with number (only letters):

<input type="text" name="nome" placeholder="Nome" pattern="^[a-zA-Z][a-zA-Z-_\.]{1,20}$" required>

Allow at least 4 characters:

<input type="text" name="nome" placeholder="Nome" pattern="^[a-zA-Z][a-zA-Z-_\.]{3,20}$" required>

See some explanations:

• ^ - States position at the beginning of the string.

• $ - States position at the end of the string, or before the right line terminator at the end of the string (if any).

• -_ - corresponds to a single character in the list -_ (case differentiation).

• {1,20} - Quantifier - Corresponds between 1 and 20 times, as many times as possible, returning as needed.

• a-z - a unique character in the range between one (ASCII 97) and z (ASCII 122) (case sensitive).

• A-Z - a single character in the range between A (ASCII 65) and Z (ASCII 90) (case sensitive).

See more examples here: http://html5pattern.com/Names.

jsfiddle: https://jsfiddle.net/bLg24qog/5/

regex101 : https://regex101.com/r/iCXgjf/2