Как сохранить меню в свернутом и развернутом состоянии после перезагрузки страницы с помощью jquery - PullRequest
Новая
       6

Как сохранить меню в свернутом и развернутом состоянии после перезагрузки страницы с помощью jquery

0 голосов
/ 01 октября 2019

Я хочу, чтобы моя боковая панель свернулась или раскрылась, пока страница обновляется по выбору пользователя. У меня есть три файла.
Header.php
Sidebar.php

Заголовок содержиттолько кнопка, чтобы щелкнуть, чтобы развернуть боковую панель свертывания, а боковая панель содержит HTML-код боковой панели.

Я хочу показать свертывание и развернуть работу с cookie, если пользователи выбирали развернутую боковую панель, она всегда должна отображать расширенную боковую панель при обновлении страницылибо показывает коллапс, он должен показывать боковую панель свертывания.

Он работает с классом тела "mmc", я хочу добавить класс тела mmc, пока пользователи выбирают коллапс, и он никогда не истечет, пока пользователи не выберут другой вариант, дажепока пользователи обновляют страницу.

Jquery

// используется для меню боковой панели 

$("#main-menu-toggle").on("click", function (event){
           event.preventDefault(); 

    $("body").toggleClass("mmc");
    alert('root');


    if($('body').hasClass('ccm')){
        localStorage.setItem('mmc', 'ccm');
         localStorage.removeItem('ccm');
    }
    else if (!$('body').hasClass('ccm')){
        localStorage.removeItem('mmc');
        localStorage.setItem('ccm', 'mmc');
    }



    //$.cookie('main-menu-toggle', true);
});

HTML 

<body class="ccm">
<button id="main-menu-toggle" type="button"><i class="navbar-icon fa fa-bars icon"></i><span class="hide-menu-text">HIDE MENU</span></button>

<div id="main-menu"  class="sminscroll">
        <p class="navtxt hide">NAVIGATION</p>
          <ul class="navigation">
            <li class="mm-dropdown mm-dropdown-root"><a href="Javascript:void(0);"><i class="menu-icon fa fa-cubes"></i> <span>Group Management</span></a>
              <ul >
                <li class="mmc-title">Group Management</li>
                <li><a href="group-management.php"><span class="dash"><i class="fa fa-angle-double-right"></i></span>View Group</a></li>
                <li><a href="create-groups.php"><span class="dash"><i class="fa fa-angle-double-right"></i></span>Create Group</a></li>
                <li class="hide"><a href="edit-group.php"><span class="dash"><i class="fa fa-angle-double-right"></i></span>Edit Group</a></li>

                <li class="hide"><a href="group-details.php"><span class="dash"><i class="fa fa-angle-double-right"></i></span>Group Details</a></li>
              </ul>
            </li>
<ul>
</div>
</body>
...