HTML and URL Helper methods in Asp.Net MVC


The main purpose of any web request is to deliver the HTML content to the user. In Asp.Net MVC, we have two view engines ASPX and Razor two render HTML content to browser. In addition to these view engines Asp.Net MVC offers some helper methods to generate HTML content in View, those are Html Helper and Url Helper classes.

Html Helper class is used to generate HTML content whereas URL Helper class used to format URL’s. These Html Helper and Url Helper classes does not have many methods of their own framework attaches behaviour via extension methods.

Open Microsoft Visual Studio 2013 => Create simple Asp.net MVC application => Add some Controller and add some view by right click on controller Action method select Add view.

@{

    Layout = null;

}

 

<!DOCTYPE html>

 

<html>

<head>

    <meta name="viewport" content="width=device-width" />

    <title>Index</title>

</head>

<body>

    <div>

        This is for Url Helper class example: <img src='@Url.Content("~/Content/images/logo.jpg")' /> <br/>

        This is for Html Helper class example: @Html.ActionLink("Homepage", "Index", "Home")

    </div>

</body>

</html>

 

The above code generates the HTML content as shown below in browser.

<html>

<head>

    <meta name="viewport" content="width=device-width" />

    <title>Index</title>

</head>

<body>

    <div>

        This is for Url Helper class example: <img src='/vdir/Content/images/logo.jpg' /> <br/>

        This is for Html Helper class example: <a href="/vdir/Home/Index">Homepage</a>

    </div>

</body>

</html>

In this way even we can generate HTML content by using Html helper and Url Helpre classes.