[ASP.NET MVC] Routing – Outgoing URLs

The first function of the Routing system is to examine the incoming URLs and figure out for which controller, action, and parameters the request is intended. The second function of it is to generate outgoing URLs.

 

1. Outgoing URLs

It is pretty common to create a link (<a> anchor tag) in a view to navigate to other parts of the site or send data back to the server using “POST“. Or sometimes you need to find a redirect URL inside the action method.

In MVC, there are no physical locations anymore, therefore you need to generate a URL using controller, action and parameters.

 

2. Manually Defined URLS

It is possible that you can define URLs manually. This might be quick and easy in some cases. But generally, it is not flexible and any routing changes will break the link. DO NOT DEFINE URLs MANUALLY!!!!

<a href="/Product/List">Product List</a>

 

3. Generating URLs in Views (1) – Html.ActionLink

In a view, the most straight forward way to generate an URL is to use “ActionLink()” method of the “HtmlHelper” class. The “ActionLink()” method returns an anchor element that contains the virtual path of the specified action.

There are many overloaded versions of “ActionLink()” method, but the most basic ones are like these:

  • public static MvcHtmlString ActionLink(this HtmlHelper htmlHelper, string linkText, string actionName) // link text + action
  • public static MvcHtmlString ActionLink(this HtmlHelper htmlHelper, string linkText, string actionName, string controllerName) //  link text + action + controller

You can pass extra values as additional parameters:

  • Object routeValues: the parameters for a route
  • Object htmlAttributes: the HTML attributes to set for the element

Note that you can even target other controllers by specifying the name of the Controller.

@Html.ActionLink("About", "About")  <br />
@Html.ActionLink("About", "About", "Product") <br />
@Html.ActionLink("About", "About", new { id = 1 }) <br />
@Html.ActionLink("About", "About", new { id = 1 }, new { target = "_self" }) <br />
@Html.ActionLink("About", "About", "Product", new { id = 1 }, new { @class = "mylink" })

The Html output is

<a href="/Home/About">About</a>  <br />
<a href="/Product/About">About</a> <br />
<a href="/Home/About/1">About</a> <br />
<a href="/Home/About/1" target="_self">About</a> <br />
<a href="/Product/About/1" class="mylink">About</a>

Note that how the “class” attribute is specified. The “class” is a keyword so you need to prefix with the “@” character.

One more thing! What if you provide a route value which does not correspond with a route parameter? The values are appended to the outgoing URL as the query string.

@Html.ActionLink("About", "About", new { id = 1, myName = "Homer" })

<a href="/Home/About/1?myName=Homer">About</a>

 

4. Generating URLs in Views (2) – Url.Action

The “ActionLink()” method is very powerful but it generates an anchor tag as well as an URL. What if you only want to get the URL as a string? You need to use the “Action()” method of the “UrlHelper” class. You can access the instance of the “UrlHelper” class in a view using the “Url” property.

  • public string Action(string actionName)
  • public string Action(string actionName, Object routeValues)
  • public string Action(string actionName, string controllerName)
  • public string Action(string actionName, string controllerName, RouteValueDictionary routeValues)

The “Url.Action()” method works in the same way as the “Html.ActionLink()” method.

Link1 : @Url.Action("About") <br />
Link2 : @Url.Action("About", new { id = 1 }) <br />
Link3 : @Url.Action("About", "Product") <br />
Link4 : @Url.Action("About", "Product", new { id = 1, name = "Homer" })

 

Link1 : /Home/About <br />
Link2 : /Home/About/1 <br />
Link3 : /Product/About <br />
Link4 : /Product/About/1?name=Homer

 

5. Generating URLs in Views (3) – Html.RouteLink

The “Html.ActionLink()” method generates URLs based on the action name and the controller name. Another way to generate URLs is to use the route name or route values.

  • public static MvcHtmlString RouteLink(this HtmlHelper htmlHelper, string linkText, Object routeValues)
  • public static MvcHtmlString RouteLink(this HtmlHelper htmlHelper, string linkText, string routeName)

The “RouteLink()” method does not have the “controller” and “action” variables. They are not special variables any more. Rather, you can use route values in general as an anonymous object.

@Html.RouteLink("About", new { controller = "Home", action = "About" })  <br />
@Html.RouteLink("About", "Default", new { action = "About" })  <br />
@Html.RouteLink("Product Info", new { controller = "Product", action = "Info", id = "1" })  <br />
@Html.RouteLink("Product List", "Default", new { controller = "Product", action = "List" })

 

<a href="/Home/About">About</a> <br />
<a href="/Home/About">About</a> <br />
<a href="/Product/Info/1">Product Info</a> <br />
<a href="/Product/List">Product List</a>

 

6. Generating URLs in Views (4) – Url.RouteUrl

The “UrlHelper.RouteUrl()” method returns an Url as a string based on the route name or route values.

  • public string RouteUrl(Object routeValues)
  • public string RouteUrl(string routeName)
  • public string RouteUrl(RouteValueDictionary routeValues)
  • public string RouteUrl(string routeName, Object routeValues)
  • public string RouteUrl(string routeName, RouteValueDictionary routeValues)
Link1 : @Url.RouteUrl(new { controller = "Home", action = "About" }) <br />
Link2 : @Url.RouteUrl("Default", new { action = "About" }) <br />
Link3 : @Url.RouteUrl(new { controller = "Product", action = "Info", id = "1" }) <br />
Link4 : @Url.RouteUrl("Default", new { controller = "Product", action = "List" })

 

Link1 : /Home/About <br />
Link2 : /Home/About <br />
Link3 : /Product/Info/1 <br />
Link4 : /Product/List

 

7. Generating URLs in Action Methods (1) – Url.Action, Url.RouteUrl

In action methods, you can generate URLs using the instance of the “UrlHelper” class. You can access this object using the “Url” property.

ViewBag.Link1 = Url.Action("Info", "Product", new { id = 1 });  // /Product/Info/1
ViewBag.Link2 = Url.RouteUrl(new { controller = "Home", action = "About" }); // /Home/About

 

@ViewBag.Link1 <br />
@ViewBag.Link2

 

8. Generating URLs in Action Methods (2) – RedirectToAction

The “RedirectToAction()” method is used to return an object of “RedirectToRouteResult“. It actually returns an HTTP 302 response to the browser, which causes the browser to make a GET request to the specified action.

  • protected internal RedirectToRouteResult RedirectToAction(string actionName)
  • protected internal RedirectToRouteResult RedirectToAction(string actionName, Object routeValues)
  • protected internal RedirectToRouteResult RedirectToAction(string actionName, string controllerName)
  • protected internal RedirectToRouteResult RedirectToAction(string actionName, string controllerName, Object routeValues)

The method works the same way as the “HtmlHelper.ActionLink()” or “UrlHelper.Action()“.

public ActionResult ProductList()
{
  return RedirectToAction("List", "Product"); // Produt/List
}

public ActionResult AnotherAbout()
{
  return RedirectToAction("About", new { controller = "Home", id = "1" }); // Home/About/1
}

 

9. Generating URLs in Action Methods (3) – RedirectToRoute

The “RedirectToRoute()” method is also used to return an object of “RedirectToRouteResult“.

  • protected internal RedirectToRouteResult RedirectToRoute(Object routeValues)
  • protected internal RedirectToRouteResult RedirectToRoute(string routeName)
  • protected internal RedirectToRouteResult RedirectToRoute(string routeName, Object routeValues)

The method works the same way as the “HtmlHelper.RouteLink()” or “UrlHelper.RouteUrl()“.

public ActionResult ProductList()
{
  return RedirectToRoute(new { controller = "Product", action = "List" }); // Produt/List
}

public ActionResult AnotherAbout()
{
  return RedirectToRoute("Default", new { controller = "Home", action="About", id = "1" }); // Home/About/1
}

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 )

Google photo

You are commenting using your Google 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 )

Connecting to %s