83330

how to highlight selected tab of master page in asp.net mvc3

Question:

i have created a master page with lots of effort but i am not able to figure out how to make my tab selected based on the user click. i have used one method to do that but finding very complicated as i have pass a viewdata from each of my controller which i dont like it, below is how i have done code in controller

ViewData["ActiveMenu"] = "Inbox";

and in my master page i have written a jquery like below to make the tab highlighted.

$('#lnkInbox').mouseout(function () { $('#aInbox').removeClass('aInbox-Hover'); $('#aInbox').addClass('aInbox'); //put hover effect on the selected menu var activeMenu = '<%:ViewData["ActiveMenu"] %>'; if (activeMenu == "Account") { $('#aAccount').removeClass('aAccount'); $('#aAccount').addClass('aAccount-Hover'); }});

this is how i am doing but is there any other way i can do that...

please suggest i have found one good link <a href="https://stackoverflow.com/questions/4728777/active-menu-item-asp-net-mvc3-master-page" rel="nofollow">active menu item - asp.net mvc3 master page</a> but the answer which is showed there i am not able understand how to i utilize in my code and where to write the code in my project.

Answer1:

Use the <a href="https://stackoverflow.com/questions/4728777/active-menu-item-asp-net-mvc3-master-page" rel="nofollow">answer you found</a>. To create helper class add new class to you project, i.e. like this

public static class LinkHelpers { //copy here the first block of code from the answer }

Add to your HomeController methods (probably you already have them):

public class HomeController : Controller { public ActionResult About() { return View() } public ActionResult Index() { return View() } }

Create respective views and add to your master page

<ul> <li>@Html.MenuLink("Main", "Index", "Home")</li> <li>@Html.MenuLink("About us", "About", "Home")</li> </ul>

And finally in your css file declare

.current{background-color:red;}

Recommend

  • $stateChangeStart don't work when user refresh browser
  • Limit the number of visible pages in pagination
  • Fading between images
  • Increasing dimensions on hover without changing the position of other elements
  • jQuery panel slider opens with button click but won't close
  • CSS transition glitch
  • Samsung Galaxy Tab 10.1 and -webkit-tap-highlight-color style?
  • How to keep button state across different pages?
  • wxWidgets: Detecting click event on custom controls
  • Get css animation property with jQuery
  • CSS: glowing text with glow very wide and high
  • QPushButton is not changing the background-color proper
  • How do you remove the JComboBox 'click and see dropdown' functionality?
  • Ajax Upload File: $_FILES is empty but files exists in request header
  • Can I check if a recipient has an automatic reply before I send an email?
  • Change multiple background-images with jQuery
  • Java: can you cast Class into a specific interface?
  • Highlight one bar in a series in highcharts?
  • AES padding and writing the ciphertext to a disk file
  • Menu Color Fade on Hover with Jquery
  • Updating server-side rendering client-side
  • How to extract text from Word files using C#?
  • Can I have the cursor start on a particular column by default in jqgrid's edit mode?
  • 'TypeError' while using NSGA2 to solve Multi-objective prob. from pyopt-sparse in OpenMDAO
  • How to limit post in wp_query
  • Websockets service method fails during R startup
  • bootstrap to use multiple ng-app
  • Comma separated Values
  • How to delete a row from a dynamic generate table using jquery?
  • CSS Applying specific rule for a specific monitor resolution with only CSS is posible?
  • How to set the response of a form post action to a iframe source?
  • Setting background image for body element in xhtml (for different monitors and resolutions)
  • python draw pie shapes with colour filled
  • Are Kotlin's Float, Int etc optimised to built-in types in the JVM? [duplicate]
  • Running Map reduces the dimensions of the matrices
  • Reading document lines to the user (python)
  • Binding checkboxes to object values in AngularJs
  • Net Present Value in Excel for Grouped Recurring CF
  • jQuery Masonry / Isotope and fluid images: Momentary overlap on window resize
  • How to load view controller without button in storyboard?