Skip to content

Instantly share code, notes, and snippets.

@oguzhaneren
Created November 10, 2016 13:29
Show Gist options
  • Save oguzhaneren/2953c9d81e296269fa3fce287fe542a6 to your computer and use it in GitHub Desktop.
Save oguzhaneren/2953c9d81e296269fa3fce287fe542a6 to your computer and use it in GitHub Desktop.
Asp.net Core TagHelper for adding 'active' class to current active link
[HtmlTargetElement(Attributes = ControllersAttributeName)]
[HtmlTargetElement(Attributes = ActionsAttributeName)]
[HtmlTargetElement(Attributes = RouteAttributeName)]
[HtmlTargetElement(Attributes = ClassAttributeName)]
public class ActiveLinkTagHelper : TagHelper
{
private const string ActionsAttributeName = "asp-active-actions";
private const string ControllersAttributeName = "asp-active-controllers";
private const string ClassAttributeName = "asp-active-class";
private const string RouteAttributeName = "asp-active-route";
[HtmlAttributeName(ControllersAttributeName)]
public string Controllers { get; set; }
[HtmlAttributeName(ActionsAttributeName)]
public string Actions { get; set; }
[HtmlAttributeName(RouteAttributeName)]
public string Route { get; set; }
[HtmlAttributeName(ClassAttributeName)]
public string Class { get; set; } = "active";
[HtmlAttributeNotBound]
[ViewContext]
public ViewContext ViewContext { get; set; }
public override void Process(TagHelperContext context, TagHelperOutput output)
{
RouteValueDictionary routeValues = ViewContext.RouteData.Values;
string currentAction = routeValues["action"].ToString();
string currentController = routeValues["controller"].ToString();
if (IsNullOrEmpty(Actions))
Actions = currentAction;
if (IsNullOrEmpty(Controllers))
Controllers = currentController;
string[] acceptedActions = Actions.Trim().Split(',').Distinct().ToArray();
string[] acceptedControllers = Controllers.Trim().Split(',').Distinct().ToArray();
if (acceptedActions.Contains(currentAction) && acceptedControllers.Contains(currentController))
{
SetAttribute(output, "class", Class);
}
base.Process(context, output);
}
private void SetAttribute(TagHelperOutput output, string attributeName, string value, bool merge = true)
{
var v = value;
TagHelperAttribute attribute;
if (output.Attributes.TryGetAttribute(attributeName, out attribute))
{
if (merge)
{
v = $"{attribute.Value} {value}";
}
}
output.Attributes.SetAttribute(attributeName, v);
}
}
<ul>
<li asp-active-controllers="Products" asp-active-actions="Index,Details" >
<a asp-area="" asp-controller="Products" asp-action="Index">Products</a>
</li>
<li asp-active-controllers="Profile" asp-active-actions="Index,View,Details" asp-active-class="online">
<a asp-area="" asp-controller="Profile" asp-action="Index">My Profile</a>
</li>
</ul>
@is-consulting
Copy link

I liked this Solution but it didnt work properly with lowercase routing like this:

services.AddRouting(options => { options.LowercaseUrls = true; });

So I created a compatible gist based on yours here:
https://gist.github.com/enohka/0d198ed758cd5b048d9d48dd61830f3c

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment