Implement Validation for HTML form without JavaScript Learn Regular Expression

How often have you found yourself writing some quickie regular expression to verify a particular textbox. Thanks to the new pattern attribute, we can insert a regular expression directly into our markup.

<form action=”” method=”post”>
<label for=”username”>Create a Username: </label>
<input type=”text”
name=”username”
id=”username”
placeholder=”4 <> 10″
pattern=”[A-Za-z]{4,10}”
autofocus
required>
<button type=”submit”>Go </button>
</form>

If you’re moderately familiar with regular expressions, you’ll be aware that this pattern: [A-Za-z]{4,10} accepts only upper and lowercase letters. This string must also have a minimum of four characters, and a maximum of ten.

Notice that we’re beginning to combine all of these new awesome attributes!

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s