Comment ajouter la classe « active » à Html.ActionLink dans ASP.NET MVC pour la navigation Bootstrap ?

Ajout de la classe "active" à Html.ActionLink dans ASP.NET MVC

Context

Ajout d'une classe "active" à une barre de navigation Bootstrap est une étape essentielle pour fournir un retour visuel aux utilisateurs sur la page actuelle sur laquelle ils se trouvent. Lorsque vous utilisez Html.ActionLink pour générer les liens de navigation, vous pouvez vous attendre à attribuer la classe au lien lui-même. Cependant, pour une fonctionnalité correcte, la classe doit être appliquée au

Solution

Pour répondre à cette exigence, modifiez votre code comme suit :

• @Html.ActionLink("Home", "Index", "Home")
• @Html.ActionLink("About", "About", "Home")
• @Html.ActionLink("Contact", "Contact", "Home")

En appliquant la classe "active" à l'élément

élément, Bootstrap stylisera correctement le lien pour indiquer la page active.

Considérations avancées

Pour les scénarios dans lesquels plusieurs actions ou contrôleurs peuvent déclencher le comportement sélectionné, envisagez d'utiliser une méthode d'extension HtmlHelper :

public static string IsSelected(this IHtmlHelper htmlHelper, string controllers, string actions, string cssClass = "selected")
{
    string currentAction = htmlHelper.ViewContext.RouteData.Values["action"] as string;
    string currentController = htmlHelper.ViewContext.RouteData.Values["controller"] as string;

    IEnumerable<string> acceptedActions = (actions ?? currentAction).Split(',');
    IEnumerable<string> acceptedControllers = (controllers ?? currentController).Split(',');

    return acceptedActions.Contains(currentAction) && acceptedControllers.Contains(currentController) ?
        cssClass : String.Empty;
}</string></string>

Avec cette extension, vous pouvez désormais utiliser la syntaxe suivante :

Home

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!