+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: Using CodeIgniter (https://forum.codeigniter.com/forumdisplay.php?fid=5)
+--- Forum: General Help (https://forum.codeigniter.com/forumdisplay.php?fid=24)
+--- Thread: How to make nav-link active (/showthread.php?tid=90794)
How to make nav-link active - Tokioshy - 05-05-2024
I was trying to make class="nav-link" active every time I clicked the navbar navigation. So, for example, I have 5 navbar navigation. Home, About, Contact, Comic, and People. When I click the Home, the class of class="nav-link" will be active. So, it will become class="nav-link active". Then, when I click another navbar navigation, for example About, the class="nav-link active" at Home navbar navigation, will disappear and will appear again in the About navbar navigation. So the class from the navbar navigation of About will be class="nav-link active" while Home become class="nav-link" again. It's kinda hard to explain but I hope I explain it correctly
) And sorry for the bad grammar lolll. But anyway, here is my current code, I tried it with flash data on the controller like in the screenshot. Then, I destroy the session and make a new one. Is there any alternative code to make it? Like, more simpler code? Or easier code??Screenshots:
https://i.imgur.com/I16sK93.png
https://i.imgur.com/RvgJmqg.png
RE: How to make nav-link active - InsiteFX - 05-05-2024
Some thing like this.
PHP Code:
// in your controller set the page name
$data['page'] = 'home';
return view('homeView', $data);
// in your view file
<nav>
<ul>
<li class="<?= ($page == "home" ? "active" : ""); ?>"> <a href="/">Home</a> </li>
<li class="<?= ($page == "apps" ? "active" : ""); ?>"> <a href="#">Apps</a> </li>
<li class="<?= ($page == "forums" ? "active" : ""); ?>"> <a href="#">Forums</a> </li>
</ul>
</nav>
RE: How to make nav-link active - luckmoshy - 05-05-2024
The other best way is global usage, like
Code:
/*CI URI */service('uri')->getSegment(4) ==='link'? 'active: nullRE: How to make nav-link active - Tokioshy - 05-06-2024
(05-05-2024, 10:41 PM)InsiteFX Wrote: Some thing like this.
PHP Code:// in your controller set the page name
$data['page'] = 'home';
return view('homeView', $data);
// in your view file
<nav>
<ul>
<li class="<?= ($page == "home" ? "active" : ""); ?>"> <a href="/">Home</a> </li>
<li class="<?= ($page == "apps" ? "active" : ""); ?>"> <a href="#">Apps</a> </li>
<li class="<?= ($page == "forums" ? "active" : ""); ?>"> <a href="#">Forums</a> </li>
</ul>
</nav>
Yeah this one is work for me as well. Thanks for the help!