ActionLink HTML Helper in MVC3
- The ActionLink method renders a hyperlink (anchor tag) to another controller action.
- The ActionLink helper uses routing API under the hood to generate the URL.
Demo
It has following overloads :
Overload 1 :
This overloas accepts linkText which is of type string and actionName where to redirect.
Syntax :
<p>
@Html.ActionLink("About", "About")
</p>
In the above syntax, we have specified actionName as About. When you will click the link, it will redirect to the About action method of the same controller. When you create a link to action method of same controller, to which View belongs then no need to specify controller explicitly.
UI :
On click of the link, it will take you to About Action method.
Action Method :
Rendered HTML :
<a href="/Home/About">About</a>
We have not spcefied the controller name, but still it took the current controller's name i.e. Home. When you want to link to the action method of same controller, no need to specify the controller name explicitly.
Overload 2 :
.jpg)
This overload accepts one more parameter than previous overload. We can specify values to pass to the action method using routeValues object.
Syntax :
<p>
@Html.ActionLink("Overload 2","About",new {id=6})
</p>
In the above code we gave link text, name of the action method to redirect and we have passed id parameter as routeValue object. We will get this id at action method.
UI :
The above link will redirect you to About Action method which has id parameter.
Action Method :
The parameter is which is sent as routeValue object is received as id parameter at About action method.
Rendered HTML :
<p>
<a href="/Home/About/6">Overload 2</a>
</p>
Overload 3 :
This overload accepts RouteValueDictionary object of routeValues. We can pass the collection of route values using this object.
Syntax :
<p>
@Html.ActionLink("Overload 3","About",dic)
</p>
In the above screenshot we have created a RouteValueDictionary object and added two route values to it. This object is passed as third parameter of this overload.
UI :
Action Method :
The name and id parameters are received as passed in routeValues object.
Rendered HTML:
<p>
<a href="/Home/About/1412?name=Jack%20Wilshere">Overload 3</a>
</p>
Overload 4 :
This overload accepts controller name, different from previous overloads. When you want to redirect the link to action method of other controller, then you explicitly specify the name of the controller.
Syntax :
<p>
@Html.ActionLink("Overload 4","About","Home")
</p>
UI :
Rendered HTML :
<p>
<a href="/Home/About">Overload 4</a>
</p>
Overload 5 :
This overload accepts link text and action name which is common, but also routeValues object and htmlAttributes object.
Syntax :
<p>
@Html.ActionLink("Overload 5", "About", new { name = "Jack Wilshere" }, new {@class = "linkText" })
</p>
UI :
The CSS class is applied which is set as part of htmlAttributes object.
Action Method :
The name parameter is also passed as supplied as rout value. The id parameter in this case is defined as nullable, so that even if you do not pass it will take it as null.
Rendered HTML :
<p>
<a class="linkText" href="/Home/About?name=Jack%20Wilshere">Overload 5</a>
</p>
Overload 6 :
Syntax :
<p>
@Html.ActionLink("Overload 6", "About", dic, new { @class = "linkText" })
</p>
UI :
Action Method :
Rendered HTML :
<a class="linkText" href="/Home/About?Count=2&Keys=System.Collections.Generic.Dictionary%602%2BKeyCollection%5BSystem.String%2CSystem.Object%5D&Values=System.Collections.Generic.Dictionary%602%2BValueCollection%5BSystem.String%2CSystem.Object%5D">Overload 6</a>
(h)
ReplyDelete