Comment ajouter efficacement la classe « Active » aux liens de navigation ASP.NET MVC ?

Ajout de la classe active à Html.ActionLink

Dans ASP.NET MVC, il est courant de définir la classe "active" sur les éléments de navigation pour indiquer la page active actuelle. Cependant, l'ajout de la classe directement au tag n'est peut-être pas l'approche souhaitée.

Considérations sur Bootstrap

Pour Bootstrap, la classe active est généralement appliquée au

plutôt que l'élément étiqueter. Par conséquent, vous devez modifier votre code pour qu'il ressemble à ceci :

Affectation dynamique de classe

Pour automatiser le processus d'attribution de la classe active en fonction de la page actuelle, vous pouvez utiliser l'approche suivante :

En utilisant la propriété ViewContext.RouteData.Values, vous pouvez déterminer automatiquement l'action et le contrôleur en cours. L'opérateur ternaire vous permet d'ajouter conditionnellement la classe active en fonction de l'action effectuée.

HtmlHelper Extension

Pour une solution plus propre et plus élégante, vous pouvez créer un Méthode d'extension HtmlHelper :

public static string IsSelected(this HtmlHelper html, string controllers = "", string actions = "", string cssClass = "selected")
{
  // Get the current action and controller
  string currentAction = html.ViewContext.RouteData.Values["action"].ToString();
  string currentController = html.ViewContext.RouteData.Values["controller"].ToString();

  // Create arrays of accepted actions and controllers
  string[] acceptedActions = actions.Trim().Split(',').Distinct().ToArray();
  string[] acceptedControllers = controllers.Trim().Split(',').Distinct().ToArray();

  // Check if the current action and controller match any of the accepted values
  return acceptedActions.Contains(currentAction) && acceptedControllers.Contains(currentController) ?
    cssClass : string.Empty;
}

Cette méthode d'extension vous permet d'attribuer facilement la classe active en utilisant ce qui suit syntaxe :

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!