URL–New HTML5 input element

In earlier post we have seen how the email input tag work in the browser. HTML5 comes with lots of new goodies and today we are going to see one of another new html5 input types URL.

In most of the sites once you fill your contact and personal information it will ask for your URL. Till now there is no specific type for URL and we have to manually validate the URL with the Java Script but now with the HTML5 you don’t have do that. It will automatically validate the URL. For the browsers that are not supporting this will work as normal input text box.

So let’s take a simple example of URL input type. I am going to use same ASP.NET MVC project that I have used for the earlier post. So Here is the code for that.


@{
  ViewBag.Title = "Home Page";
}

<h2>@ViewBag.Message</h2>
<p>
  To learn more about ASP.NET MVC visit <a href="http://asp.net/mvc" title="ASP.NET MVC Website">http://asp.net/mvc</a>.
</p>
<form action="" method="post">

  <label for="urlInput">URL:</label>
  <input id="urlInput" name="urlInput" type="url"/>

  <button type="submit"> Check Input URL</button>
</form>

Now let's run that in browser. So once you enter some wrong Url and then click on submit button it will give error message like following.


URL,HTML5, Input type

That’s it. You can see its very easy and I don’t have to write code for the URL validation. It will do that validation automatically. Hope you liked it. Stay tuned for more..till than Happy programming.

Shout it

kick it on DotNetKicks.com

1 comment:

  1.  
    Wow, the game has
    changed with the announcement that Adobe is no longer supporting development
    for FLASH for mobile devices or TV…it is focusing on youtube html5 and Adobe
    AIR apps instead….the news got around the game development community quickly.
    I think the market penetration of mobile devices like the iPad, iPhone, and
    iTouch from Apple being a merket leader who doesn’t support FLASH made a true
    impression on developers whose clients pages were losing views by this
    audience. Comsider Apple’s leadership history introducing CD ROM’s fiirst in
    computers, dropping the beige look of computers, introucing the iMAc, iTunes,
    Quicktime, and Jobs support of Blu Ray at Disney helped set standards in many
    industries…

    ReplyDelete

Your feedback are very important to me. Please provide your feedback via putting comments.