I'm implementing a menu in the header of my page. As the user clicks the buttons on this menu, the page is rendered just below. I would like to highlight in the menu the button for the current page of the user.
I'm calling it this way:
<li>
<a href="@Url.Action("Index", new { controller = "Informativo" })" title="Informativo"> Inf. </a>
</li>
On a system I made here, I used @section Scripts to define a small action to add a active class to a particular item, which highlights the item.
@section scripts {
<script type="text/javascript">
$(document).ready(function () {
$("#item-qualquer").toggleClass("active");
});
</script>
}
This can be done programmatically by substituting% with% by identifying #item-qualquer and Action , for example:
@section scripts {
<script type="text/javascript">
$(document).ready(function () {
$("#" + @ViewContext.RouteData.Values["action"]).toggleClass("active");
});
</script>
}