How to add active class to Html ActionLink in ASP NET MVC

0 votes

I'm trying to add an"active" class to my bootstrap navbar in MVC, but the following doesn't show the active class when written like this:

<ul class="nav navbar-nav">
  <li>@Html.ActionLink("Home", "Index", "Home", null, new {@class="active"})</li>
  <li>@Html.ActionLink("About", "About", "Home")</li>
  <li>@Html.ActionLink("Contact", "Contact", "Home")</li>
</ul>

This resolves to what looks like a correctly formatted class, but doesn't work:

<a class="active" href="/">Home</a>

In the Bootstrap documentation it states that 'a' tags shouldn't be used in the navbar, but the above is how I believe is the correct way of adding a class to an Html.ActionLink. Is there another way I can do this?

Jul 23, 2020 in Angular by kartik
• 37,520 points
7,979 views

1 answer to this question.

0 votes

Hello @kartik,

The way you handle your UI style based on what is active or not has nothing to do with ASP.NET MVC's ActionLink helper. This is the proper solution to follow how the Bootstrap framework was built.

<ul class="nav navbar-nav">
    <li class="active">@Html.ActionLink("Home", "Index", "Home")</li>
    <li>@Html.ActionLink("About", "About", "Home")</li>
    <li>@Html.ActionLink("Contact", "Contact", "Home")</li>
</ul>

Hope it helps!!

Thank You!!

answered Jul 23, 2020 by Niroj
• 82,840 points

Related Questions In Angular

0 votes
1 answer

How do you bind an Enum to a DropDownList control in ASP.NET?

Hello @kartik, I probably wouldn't bind the data as it's ...READ MORE

answered Jul 23, 2020 in Angular by Niroj
• 82,840 points
3,015 views
0 votes
1 answer

How can I strip HTML tags from a string in ASP.NET?

Hello @Kartik, If it is just stripping all HTML tags ...READ MORE

answered Jul 23, 2020 in Angular by Niroj
• 82,840 points
1,825 views
0 votes
1 answer

How to allow download of .json file with ASP.NET?

Hello @kartik, If you want to manually add ...READ MORE

answered Jul 23, 2020 in Angular by Niroj
• 82,840 points
2,155 views
0 votes
1 answer

How to perform Email Validation in Javascript?

Validation is a method to authenticate the ...READ MORE

answered Feb 6, 2020 in Angular by Niroj
• 82,840 points
976 views
+1 vote
1 answer

How to make anchor tag with routing using Laravel?

Hey @kartik, First you have to go to ...READ MORE

answered Mar 18, 2020 in Laravel by Niroj
• 82,840 points
23,062 views
0 votes
1 answer

What is redirection in Laravel?

Named route is used to give specific ...READ MORE

answered Mar 18, 2020 in Laravel by Niroj
• 82,840 points
3,013 views
0 votes
1 answer

How to install Laravel via composer?

Hello, This is simple you just need to ...READ MORE

answered Mar 23, 2020 in Laravel by Niroj
• 82,840 points
2,939 views
+1 vote
1 answer

What are named routes in Laravel and How can specify route names for controller actions?

Hey @kartik, Named routing is another amazing feature of ...READ MORE

answered Mar 23, 2020 in Laravel by Niroj
• 82,840 points
44,856 views
0 votes
2 answers

How to access session variables from any class in ASP.NET?

Accessing session Variable in a class file ...READ MORE

answered Sep 3, 2020 in Angular by Okugbe
• 280 points
7,673 views
0 votes
1 answer

How to create a URL in the controller .NET MVC?

Hello @kartik, If you just want to get ...READ MORE

answered Jul 23, 2020 in Angular by Niroj
• 82,840 points
6,073 views
webinar REGISTER FOR FREE WEBINAR X
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP