Tengo un menú con opciones dentro y al dar clic en una opción me carga la página (refresca) pero el menú vuelve a su estado original, se contrae.
¿De que forma puedo dejar el menú expandido después de dar clic a una opción? Probé con localStorage pero no sé como implementarlo adecuadamente
-- CODIGO DEL MENU VERTICAL (menu_vertical.php) --
<?php
#LIBRERÍAS
require ("../includes/header.php");
?>
<div class='nav-vertical'>
<div class="dashboard-nav">
<nav class="dashboard-nav-list">
<div class='dashboard-nav-dropdown'><a class="dashboard-nav-item dashboard-nav-dropdown-toggle">
<i class="fas fa-chart-pie-alt"></i> Reportes</a>
<div class='dashboard-nav-dropdown-menu'>
<a href="test1.php" class="dashboard-nav-dropdown-item"><i class="fas fa-file-alt"></i>Test1</a>
<a href="test2.php" class="dashboard-nav-dropdown-item"><i class="fas fa-file-alt"></i>Test2</a>
<a href="test3.php" class="dashboard-nav-dropdown-item"><i class="fas fa-file-alt"></i>Test3</a>
<a href="test4.php" class="dashboard-nav-dropdown-item"><i class="fas fa-file-alt"></i>Test4</a>
<a href="test5.php" class="dashboard-nav-dropdown-item"><i class="fas fa-file-alt"></i>Test5</a>
<a href="test6.php" class="dashboard-nav-dropdown-item"><i class="fas fa-file-alt"></i>Test6</a>
</div>
</div>
<div class='dashboard-nav-dropdown'><a class="dashboard-nav-item dashboard-nav-dropdown-toggle">
<i class="fas fa-chart-pie-alt"></i> Reportes 2</a>
<div class='dashboard-nav-dropdown-menu'>
<a href="testX1.php" class="dashboard-nav-dropdown-item"><i class="fas fa-file-alt"></i>TestX1</a>
<a href="testX2.php" class="dashboard-nav-dropdown-item"><i class="fas fa-file-alt"></i>TestX2</a>
</div>
</div>
</nav>
</div>
</div>
<?php
#SCRIPTS
require ("../includes/footer.php");
?>
-- CODIGO DE LA VISTA PRINCIPAL (index.php)
<?php
#MENU VERTICAL
require ("menu_vertical.php");
?>
<body>
<img src='../images/Welcome.jpg'>
</body>
-- CODIGO DEL FOOTER (footer.php) --
<script src="../../includes/2022/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function () {
//EXPANDIR EL MENU
$('.dashboard-nav-dropdown-toggle').click(function(){
var parent = $(this).parent();
if(parent.hasClass('show')) {
parent.removeClass('show');
} else {
parent.addClass('show');
}
});
});
</script>