.Net MVC Html.ActionLink tutorial with examples

The Html.ActionLink creates an anchor element based on parameters supplied. In this example, we will learn how to use Asp .Net MVC Html.ActionLink. We will also create multiple types of Action links like:

  1. HtmlActionLink without controller name.
  2. HtmlActionLink with controller name.
  3. HtmlActionLink with parameters.
  4. HtmlActionLink with Area.
  5. HtmlActionLink with CSS class

Html.ActionLink Without Controller Name

@Html.ActionLink("Click Here", "About")

Here "Click Here" is the Link text and "About" is the Action Method you wish to call.
Note: This will only work if your view and calling Action Method resides in the same Controller.

Generated HTML Tag

Click Here

You can see it has automatically added Controller name "Home" in an anchor element.
 


Html.ActionLink With Controller Name

@Html.ActionLink("Click Here", "About","CompanyInfo")

Here "Click Here" is the Link text and "About" is the Action Method you wish to call and CompanyInfo is the Controller name.
This will be useful when you wants to call Action Method which resides in other Controller rather than Controller that generated view.

Generated HTML Tag

Click Here

 


 

Html.ActionLink With Parameters

@Html.ActionLink("Click Here", "About", "CompanyInfo", new { Id = 1 }, null)

Here "Click Here" is the Link text and "About" is the Action Method you wish to call and CompanyInfo is the Controller name and "Id" is Argument name.
Note: Do not forgot to add null as 5th parameter.

Action Method

    public ActionResult About(int Id)
    {
    return View();
    }
    

Generated HTML Tag

Click Here

 


 

Html.ActionLink With Area Name

@Html.ActionLink("Link Text", "ActionName", "ControllerName", new { Area = "AreaName" }, null)

This is useful when we want to call any Action Method which resides in particular Area .
Note: Do not forgot to add null as 5th parameter.

Generated HTML Tag

Link Text

 


 

Html.ActionLink With CSS Class

@Html.ActionLink("Click Me", "Index", "Home", null, new { @class = "myCustomLink" })

This is useful when we want to apply any CSS class to our anchor text.
Note: Do not forgot to add null as 4th parameter.

CSS Class for Html.ActionLink

    
    

Generated HTML Tag

Click Me
 
About Us | Terms of Use | Privacy Policy | Disclaimer | Contact Us Copyright © 2012-2024 CodingFusion
50+ C# Programs for beginners to practice