CODEWITHSUNDEEP
laraveltwitter-bootstrap-3
Fluxify
Fluxify

Reputation: 145

Laravel Blade Changing Active Class Bootstrap

How will I change the active class in twitter bootstrap when i visit another page with Laravel Blade Templating ?

Upvotes: 0

Views: 1153

Answers (3)

Hamid Haghdoost
Hamid Haghdoost

Reputation: 867

Thanks to Active package, these days you can simply do it like this:

class="@active('home')"

It has a lot of other options for example for wildcard activation. For example if you want to activate all routes of admin panel, you can do like this:

class="@active('admin.*')"

Upvotes: 0

Hamees A. Khan
Hamees A. Khan

Reputation: 136

I have found a simple solution for this problem. This solution has very simple trick.

And it will work for all links throughout the page.

<script>
  function addActiveClass(){
    var objs = document.getElementsByTagName('a');          // take all 'a' tags
    for(var i = 0; i < objs.length; i++){
      if(objs[i].href == window.location.href){             // check if the user is on this link
        objs[i].className = objs[i].className + " active";  // add additional 'active' class
      }
    }
  }

  addActiveClass();
</script>

Adding this code to the end of your page will do the magic.

Upvotes: 0

Mirza Obaid
Mirza Obaid

Reputation: 1717

here is an example this might can help

You could define a variable in your blade template

 <?php $nav_profile = 'active'; ?>

    @extends ('layouts.app')

    @section ('content')
..
..
    @endsection

And then in the layouts file;

<ul class="nav nav-tabs">
    <li role="presentation" class="{{ $nav_home or ''  }}"><a href="#">Home</a></li>
     <li role="presentation" class="{{ $nav_profile or ''  }}"><a href="#">Profile</a></li>
     <li role="presentation" class="{{ $nav_messages or '' }}"><a href="#">Messages</a></li>
</ul>

So, if the page includes a variable called nav_profile then insert 'active' into the class. The 'or 'part inserts an empty string if the variable is not present.

Upvotes: 2

Related Questions