0
363
ViewsHow to collapsed nav-treeview when I click the submenu in AdminLTE 3.0?
As you can see in the GIF when I click the submenu it no longer collapses. What I want is when I click the submenu it will collapse and will not automatically close when I click the page
<li class="nav-item">
<a href="#" class="nav-link <?= $page == 'patients.php' || $page == 'medical_history.php'? 'active':''?>">
<i class="nav-icon fa fa-users-medical"></i>
<p>Patients</p>
<i class="fas fa-angle-left right"></i>
</a>
<ul class="nav nav-treeview <?= $page == 'patients.php' || $page == 'medical_history.php' ? 'show':''?>">
<li class="nav-item">
<a href="patients.php" class="nav-link <?= $page == 'patients.php' ? 'active':''?>">
<i class="far fa-circle nav-icon"></i>
<p>Patient List</p>
</a>
</li>
<li class="nav-item">
<a href="medical_history.php" class="nav-link <?= $page == 'medical_history.php' ? 'active':''?>">
<i class="far fa-circle nav-icon"></i>
<p>Medical History</p>
</a>
</li>
</ul>
</li>
·
Juan Pablo Isaza
3 answers
Answer question0
Updated...
I've updated and provided the code you need... just copy and paste this code in the relevant section of your file. I'm sure this will work for you : )
<li class="nav-item <?= $page == 'patients.php' || $page == 'medical_history.php' ? 'menu-open' : '' ?>">
<a href="#" class="nav-link <?= $page == 'patients.php' || $page == 'medical_history.php' ? 'active' : '' ?>">
<i class="nav-icon fa fa-users-medical"></i>
<p>Patients</p>
<i class="fas fa-angle-left right"></i>
</a>
<ul class="nav nav-treeview">
<li class="nav-item">
<a href="patients.php" class="nav-link <?= $page == 'patients.php' ? 'active' : '' ?>">
<i class="far fa-circle nav-icon"></i>
<p>Patient List</p>
</a>
</li>
<li class="nav-item">
<a href="medical_history.php" class="nav-link <?= $page == 'medical_history.php' ? 'active' : '' ?>">
<i class="far fa-circle nav-icon"></i>
<p>Medical History</p>
</a>
</li>
</ul>
</li>
·
Juan Pablo Isaza
Report
0
If your AdminLTE template uses bootstrap, then try to add a collapse and a show class in the nested ul element right after the nav-treeview class.
·
Juan Pablo Isaza
Report
0
Just add display: none
<ul class="nav nav-treeview" style="display: none;">
·
Juan Pablo Isaza
Report
Answer question