How to add css class to Action link in MVC

Question

I am creating MVC5 project.using Inspina theme I have using Entity framework its generated Code Like this Edit delete details

Following Like this

@Html.ActionLink("Edit", "Edit", new { id = item.ClientId })  |
@Html.ActionLink("Details", "Details", new { id = item.ClientId }) |
@Html.ActionLink("Delete", "Delete", new { id = item.ClientId })

Previous added custom font icon edit button and delete class like this

 <a class="fa fa-edit">@Html.ActionLink("Edit", "Edit", new { id=item.ClientId })</a>
 <a class="fa fa-times">@Url.Action("Delete", new { id=item.ClientId })</a>

Finally I want fa fa-edit this class inside to action link code Entity framework Generator. How can I add looks like my previous button

score 3 · Accepted Answer · answered Jul 14 '16 at 10:48

3

You can add class to ActionLink like this

@Html.ActionLink("Edit", "Edit", new { id = item.ClientId }, new { @class = "fa fa-edit" }) 
@Html.ActionLink("Delete", "Delete", new { id = item.ClientId }, new { @class = "fa fa-times" })

answered Jul 14 '16 at 10:48

Rahul Nikate

6,192
5
42
54

You don´t need to add two different instances, you can do @Html.ActionLink("Edit", "Edit", new { id = item.ClientId, @class = "fa fa-edit" } – Gerry Jul 14 '16 at 23:38

score 2 · Answer 2 · answered Jul 14 '16 at 10:48

2

You can do this:

@Html.ActionLink("Edit", "Edit", new { id=item.ClientId }, new { @class = "myCssClass" })

The @ is important because class is a C# keyword.

Hope it helps!

answered Jul 14 '16 at 10:48

Itay Podhajcer

2,616
2
9
14

You don´t need to add two different instances, you can do @Html.ActionLink("Edit", "Edit", new { id = item.ClientId, @class = "fa fa-edit" } – Gerry Jul 14 '16 at 23:37
One is for MVC routing parameters and the other for HTML attributes. – Itay Podhajcer Jul 15 '16 at 09:37

score 2 · Answer 3 · answered Jul 14 '16 at 10:49

You can set it via htmlAttributes parameter of ActionLink MVC helper method like below, you should use @class property for your htmlAttributes object.

@Html.ActionLink("Edit", "Edit", new { id = item.ClientId, @class="MyClass" })  |
@Html.ActionLink("Details", "Details", new { id = item.ClientId, @class="MyClass"  }) |
@Html.ActionLink("Delete", "Delete", new { id = item.ClientId, @class="MyClass"  })

Hope this helps

How to add css class to Action link in MVC

3 Answers3