In Symfony, how can I add a 'selected' class to the currently selected page in my navigation?

Question

My navigation is written in the layout.php template

It looks like this:

<ul id="nav">
  <li><a href="item1">Item 1</a></li>
  <li><a href="item1">Item 2</a></li>
  <li><a href="item1">Item 3</a></li>
  <li><a href="item1">Item 4</a></li>
</ul>

What is the best way to get a class="current" on the currently selected page?

Answer 1

Use a helper and/or a partial to generate the menu. So lets say you have a partial _navigation.php in the module 'default':

// in layout:

<?php include_partial('default/navigation', array(
   'navigation'=>$array, 
   'active'=>has_slot('navigationActiveUrl') 
       ? get_slot('navigationActiveUrl') 
       : null)
 ); ?>

// in modules/default/templates/_navigation.php
<?php if(isset($navigation)): ?>
  <ul>
    <?php foreach($navigation as $name => $url): ?>
       <?php echo content_tag('li', link_to($name, $url), array('class' => 
         (isset($active) && $active == $url ? 'active' : null)
       )); ?>
    <?php endforeach; ?>
  </ul>
<?php endif; ?>

// in some template file:
<?php slot('navigationActiveUrl'); ?>/internal/uri<?php end_slot(); ?>

you could also just use a helper and hard code the html in there if you wont need to modify it much. using a partial simply gives you an easy way to change the markup without changing the helper function. Like wise you could make a helper function and still have it call the same partial.

Answer 2

An alternative method you should consider is using JavaScript if possible. I'm going to give an example using jQuery

$('#nav li a').each(function(){
  //You might have to do some string manipulation on the line below, but you get the idea
  if($(this).attr('href') == window.location.pathname) { $(this).addClass('current'); }; 
});

I know JS is not always an option, but it works out pretty neatly and nicely. Wild guess: The rest of your php code will not care whether the link has the selected class or not, only your css or javascript code will. If this is the case, the above method isn't really a bad option

Answer 3

I go for a simpler approach (but it may be more resource intensive):

<ul id="nav">
  <li<?php echo ($this->getActionName('item1')) ? ' class="current"' : ''; ?>><a href="item1">Item 1</a></li>
  <li<?php echo ($this->getActionName('item2')) ? ' class="current"' : ''; ?>><a href="item1">Item 2</a></li>
  <li<?php echo ($this->getActionName('item3')) ? ' class="current"' : ''; ?>><a href="item1">Item 3</a></li>
  <li<?php echo ($this->getActionName('item4')) ? ' class="current"' : ''; ?>><a href="item1">Item 4</a></li>
</ul>

Answer 4

i always use slot() and is_slot to mark tabs as selected.

On each page i display in the template i 'mark' the page with a slot with the slots name

/projects -> slot('toptabs') projects end_slot() and put

if get_slot('toptabs') == 'projects' { class="selected" }

stupid solution but is quick and works fine.