CODEWITHSUNDEEP
grailstwitter-bootstrap
tanwedar
tanwedar

Reputation: 221

Twitter Bootstrap active navbar in grails

I'm having a hard time getting the "active" class to stay across different pages. I have the navbar loading on each page via a layout, could this be the issue?

Upvotes: 3

Views: 2733

Answers (2)

Coffee Monkey
Coffee Monkey

Reputation: 472

I just have this inside my layout gsp for creating the navbar, and it works perfectly. I only have items in the navbar at the level of the controller, not for individual actions.

<li ${controllerName.equals('schedule') ? 'class="active"' : ''}>Schedule</li>

For the default controller generated by Grails, you can use

<li ${controllerName == null ? 'class="active"' : ''}>Home</li>

Upvotes: 16

Philip Tenn
Philip Tenn

Reputation: 6073

Yes, that is the issue.

Whenever you reload the page, whatever <li> element has class=active will be set to active again.

If you have /grails-app/views/layouts/main.gsp with the following:

<div class="navbar">
  <div class="navbar-inner">
    <ul class="nav">
      <li class="active"><a href="/home">Home</a></li>
      <li><a href="/fred">Fred</a></li>
      <li><a href="/barney">Barney</a></li>
    </ul>
  </div>
</div>

And your GSPs for Fred and Barney use the main.gsp layout, when you click on them, you will load the code above and the link for "Home" will still be active.

Solutions are to write a Taglib for the Navbar control, or create separate layout pages.

Upvotes: 2

Related Questions