Sunday, December 9, 2012

HTML 5: Different input types - input type email

HTML 5 have added many input types. This is one of the feature which really has made HTML 5 awesome and interesting to use. Those some input types are as below:
- email
- url
- number
- tel
- date




inputy type="email"

Now on need to write scripts to validate emails any more. With HTML 5, it can be done with just an input type

First try the code below:
<form action="" method="post">
<input type="email" required />
<input type="submit" value="Submit" />
</form>

Output:







What is does? First when you define any input type as required, users need to give any value. Secondly, as it is email so any format won't exceptable. It must be in the form of email. Wow!! isn't it simply great.

Now keep on adding some more properties like below:
<form action="" method="post">
<input type="email" required autofocus placeholder="Enter a valid email address" size="25"/>
<input type="submit" value="Submit" />
</form>

Output:



What it does?? It simply autofocus first as you open that page with autofocus and secondly you will see the text "Enter a valid email address" in the text box.

Simply great isn't it!!

No comments:

Post a Comment