时间戳

首页 > 解决方案 > 如何在 ASP.NET MVC 中向 Html.ActionLink 添加“活动”类

asp.net - 如何在 ASP.NET MVC 中向 Html.ActionLink 添加“活动”类

问题描述

我有一个_layout.cshtml这样的

<ul class="sidebar-menu tree" data-widget="tree">
    <li class="header" style="color:white;font-weight:bold;">Test Menu</li>
    <li>
        <a href="@Url.Action("Index","Monney")">
            <i class="fa fa-dashboard"></i> <span>Monney</span>
        </a>
    </li>
    <li>
        <a href="@Url.Action("Index","Bank")">
            <i class="fa fa-dashboard"></i> <span>Bank</span>
        </a>
    </li>
    <li>
        <a href="@Url.Action("Index","User")">
            <i class="fa fa-dashboard"></i> <span>User</span>
        </a>
    </li>
</ul>

我正在尝试在 MVC中将其添加"active" class到li我的活动时。sidebar-menu

我怎样才能做到这一点？

标签： asp.netasp.net-mvc

解决方案

首先，如果您单击特定链接，如果您使用 jquery，您的页面将被刷新并且活动类将被删除。所以你需要使用 Viewbag 来管理它。

您需要在控制器中定义每个操作的值。

// let say you have User controller

public ActionResult Index()
{
   ViewBag.data = "user";
   return View();
}

在您的布局中，您需要检查该 viewbag 的值

<ul class="sidebar-menu tree" data-widget="tree">
    <li class="header" style="color:white;font-weight:bold;">Test Menu</li>
    <li id="money">
        <a href="@Url.Action("Index","Monney")">
            <i class="fa fa-dashboard"></i> <span>Monney</span>
        </a>
    </li>
   <li id="bank">
        <a href="@Url.Action("Index","Bank")">
            <i class="fa fa-dashboard"></i> <span>Bank</span>
        </a>
    </li>
   <li id="user">
        <a href="@Url.Action("Index","User")">
            <i class="fa fa-dashboard"></i> <span>User</span>
        </a>
    </li>
</ul>

<script>
    $(document).ready(function () {
        if ('@ViewBag.data' != null)
        {
           $('#' + '@ViewBag.data').addClass('active');
        }
    });
</script>

推荐阅读