javascript - How to collapsed nav-treeview when I click the submenu in AdminLTE 3.0?

Solution:

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>

Answer

Solution:

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.

Answer

Solution:

Just add display: none

<ul class="nav nav-treeview" style="display: none;">

Source