Problem with treeview menu

0

Good morning I'm making a menu and I need the functionality of a treeview, but even done according to documentation when clicking the menu the desired links are not displayed (dropdown):

Code:

<ul class="sidebar-menu">
        <li class="header">MENU</li>
        <!-- Optionally, you can add icons to the links 
        <li><a href="http://localhost/sistema/inicio"><i class="fa fa-line-chart"></i> <span>Inicio</span></a></li>-->
        <li><a href="http://localhost/sistema/clientes"><i class="fa fa-users"></i> <span>Clientes</span></a></li>
        <li><a href="http://localhost/sistema/orcamentos"><i class="fa fa-folder-open"></i> <span>Orcamentos</span></a></li>
        <li><a href="http://localhost/sistema/comments"><i class="fa fa-comments-o"></i> <span>Historico</span></a></li>
        <li><a href="http://localhost/sistema/produtos"><i class="fa fa-barcode"></i> <span>Produtos</span></a></li>
        <li><a href="http://localhost/sistema/representantes"><i class="fa fa-handshake-o"></i> <span>Representantes</span></a></li>
        <li><a href="http://localhost/sistema/calendar2"><i class="fa fa-calendar-o"></i> <span>Agenda</span></a>
        </li>

        <li class="treeview">
          <a href="#"><i class="fa fa-male"></i> <span>Equipe</span>
            <span class="pull-right-container">
              <i class="fa fa-angle-left pull-right"></i>
            </span>
          </a>
          <ul class="treeview-menu">
            <li><a href="http://localhost/sistema/equipe">Usuarios</a></li>
            <li><a href="#">Log</a></li>
          </ul>
        </li>

        <li><a href="http://localhost/sistema/login/logout" onclick="return confirm('Deseja sair?')">
        <i class="fa fa-sign-out"></i> <span>Sair</span></a>
      </ul>

However, if I add the following parameter to my code, the menus within the treeview are displayed statically (without the user clicking the main menu):

<li class="treeview active">

andcomplementingthisarethefollowingfilesthatI'mloadingrightatthebeginningofmyfile:

<head><metahttp-equiv="X-UA-Compatible" content="IE=edge">


  <!-- REQUIRED JS SCRIPTS -->

  <!-- jQuery 3.1.1 -->
  <script src="<?php echo base_url("assets/plugins/jQuery/jquery-2.2.3.min.js"); ?>"></script>

  <!-- Bootstrap 3.3.6 -->
  <script src="<?php echo base_url("assets/bootstrap/js/bootstrap.min.js"); ?>"></script>

  <!-- jQuery UI 1.11.4 -->
  <link rel="stylesheet" href= "<?php echo base_url(); ?>assets/plugins/jQueryUI/jquery-ui.css">
  <script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script><title>SuperarCRM</title><!--Tellthebrowsertoberesponsivetoscreenwidth--><metacontent="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
  <!-- Bootstrap 3.3.6 -->
  <link rel="stylesheet" href= "<?php echo base_url(); ?>assets/bootstrap/css/bootstrap.min.css">
  <!-- Font Awesome -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
  <!-- Ionicons -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
  <!-- fullCalendar 2.2.5-->
  <link rel="stylesheet" href="<?php echo base_url(); ?>assets/plugins/fullcalendar/fullcalendar.min.css">
  <link rel="stylesheet" href="<?php echo base_url(); ?>assets/plugins/fullcalendar/fullcalendar.print.css" media="print">
    
asked by anonymous 30.06.2017 / 12:45

1 answer

0

Hello,

I do not know if the code I wrote will work, but at least I can give you the idea of what you need:

<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.min.js"></script><script>$('li.header').click(function(){if($('li.treeview').hasClass("active")){
    $('li.treeview').removeClass("active")
  }
  else{
    $('li.treeview').addClass("active")
  }
})
</script>

I hope I have helped.

    
30.06.2017 / 13:00