Bagaimana untuk Menambah Kelas 'aktif' ke Html.ActionLink dalam ASP.NET MVC untuk Navigasi Bootstrap?

Menambahkan Kelas "aktif" pada Html.ActionLink dalam ASP.NET MVC

Konteks

Menambah kelas "aktif" pada navbar Bootstrap ialah langkah penting untuk memberikan maklum balas visual kepada pengguna pada halaman semasa yang mereka buka. Apabila menggunakan Html.ActionLink untuk menjana pautan navigasi, anda mungkin mengharapkan untuk menetapkan kelas kepada pautan itu sendiri. Walau bagaimanapun, untuk kefungsian yang betul, kelas mesti digunakan pada

elemen.

Penyelesaian

Untuk menangani keperluan ini, ubah suai kod anda seperti berikut:

<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>

Dengan menggunakan kelas "aktif" pada

elemen, Bootstrap akan menggayakan pautan dengan betul untuk menunjukkan halaman aktif.

Pertimbangan Lanjutan

Untuk senario di mana berbilang tindakan atau pengawal boleh mencetuskan gelagat yang dipilih, pertimbangkan untuk menggunakan kaedah sambungan 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;
}

Dengan sambungan ini, anda kini boleh menggunakan yang berikut sintaks:

<li class="@Html.IsSelected(actions: "Home", controllers: "Default")">
    <a href="@Url.Action("Home", "Default")">Home</a>
</li>

Atas ialah kandungan terperinci Bagaimana untuk Menambah Kelas 'aktif' ke Html.ActionLink dalam ASP.NET MVC untuk Navigasi Bootstrap?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!