Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to add active class to codeigniter hyperlinks?

I know this question comes across a lot, but I just can't figure out how to do this using the, already answered posts.

I have a header with navigation links. I would like to add class="active" to the link that's active at the moment.

How could I do this if I have the following navigation?

<nav>
    <ul id="main_nav">
        <li class="home">
            <a href="search">
                <i class="icon-search"></i>
                <span>BEDRIJF ZOEKEN</span>
            </a>
        </li>
        <li class="categorie">
            <a href="categorieen/all">
                <i class="icon-list-ul"></i>
                    <span>CATEGORIE</span>
            </a>
        </li>
        <li class="aanbieding">
            <a href="aanbiedingen">
                <i class="icon-shopping-cart"></i>
                    <span>AANBIEDING</span>
            </a>
        </li>
        <li class="vacature">
            <a href="vacatures">
                <i class="icon-copy"></i>
                <span>VACATURE</span>
            </a>
        </li>
        <li class="agenda">
            <a href="agenda">
                <i class="icon-calendar"></i>
                <span>AGENDA</span>
            </a>
        </li>
        <li class="contact">
            <a href="contact">
                <i class="icon-envelope"></i>
                <span>CONTACT</span>
            </a>
        </li>
    </ul>
</nav>

I tried this, but it did not work:

<script>
$(function() {
    var href = $(this).find('a').attr('href');
    alert(window.location.pathname)
    if (href === window.location.pathname) {
      $(this).addClass('active');
    }
}); 
</script>   

Maybe there's a better Codeigniter-ish way?

like image 879
Kees Sonnema Avatar asked Aug 13 '13 12:08

Kees Sonnema


2 Answers

try this one.i think no need of javascript or jquery.

If you are using codeigniter then you can use URI Class.

<li class="home">
    <a class="<?php if($this->uri->segment(1)=="search"){echo "active";}?>" href="<?=base_url('search')?>">
        <i class="icon-search"></i>
        <span>BEDRIJF ZOEKEN</span>
    </a>
</li>

please let me know if you face any problem

like image 64
ABorty Avatar answered Oct 28 '22 05:10

ABorty


I created a helper and saved it into the helper directory named as "menu_helper.php":

<?php 
if(!defined('BASEPATH')) exit('No direct script access allowed');

if(!function_exists('active_link')) {
  function activate_menu($controller) {
    // Getting the class instance.
    $ci = get_instance();
    // Getting the router class to actived it.
    $class = $ci->router->fetch_class();
    return ($class == $controller) ? 'active' : '';
  }
}

Then in config/autoload.php, I added "menu" as a helper on line 91.

The last step is to put the code for print the "active" class when accessing the page (i.e. Login Page):

<li class="<?php echo activate_menu('login'); ?>">    
  <?php echo anchor('login', 'Login'); ?> 
</li>
like image 7
Lesley Fernandes Moreira Avatar answered Oct 28 '22 03:10

Lesley Fernandes Moreira