AdminLTE2 Theme- Active menu item with multi level submenus (filter secure token) -





When user click on the menu, page is reloaded and at that time current-active-menu  removed from the anchor tag(<a>).


Paste below Jquery code in your header or footer file.


This script is working OK for Admin LTE2  treeview(submenu) sidebar ==>

 /** add active class and stay opened when selected */
 $(window).on('load', function(){
                                                                 // remember we are using secure token in our url, so firstly                                                                        we have to split and filter the url as we want

var addr1 =$(location).attr('href');
var  parts = addr1.split("?");
var url = parts[parts.length-2].trim();
var  parts1 = url.split("/");
var url1 = parts1[parts1.length-1].trim();
//alert("window_href= "+ url1);

//for sidebar menu treeview
$('ul.sidebar-menu li a').each(function() {
    var mHref = $(this).attr("href");
    var  mHrefPart = mHref.split("?");
    var mUrl = mHrefPart[mHrefPart.length-2];
   // alert("Menu Url"+mUrl);
if(mUrl === undefined)
{

}

else{
  if(mUrl  == url1)
   {
     $(this).closest("li.treeview").addClass("active").css('border-left-color', '#3c8dbc');
     $(this).css('color', '#fff');
   }
}
 
})


 });




This script is working OK for custom sub-menu sidebar with panel-accordion (INNER)==>
 <script>
      $(window).on('load', function(){
    var addr1 =$(location).attr('href');
    var  parts = addr1.split("/");
    var last_part = parts[parts.length-1];
    var menu1 = $("#sidebar-wrapper .panel-default").each(function(){
  var aa = $(this).find("div[id^='accordion_menu'] a");
    $(aa).each(function(){
    // console.log($(this).closest(".collapse"));
   

    // console.log("officedesc",last_part,$(this).attr('href'));
    if(last_part.trim()==$(this).attr('href').trim()){
   
    $(this).closest(".collapse").addClass("in");
    $(this).closest("tr").css({"color": "rgb(243, 109, 33)","background" : "#2336460d"});   
    }else{
    }
   
    })
    });
   
   
   
      })
      </script>

This script is working OK. for custom menu sidebar with panel-accordion (OUTER)==>

<script>
$(window).on('load',function(){
var addr1 =$(location).attr('href');
      var  parts = addr1.split("/");
      var last_part = parts[parts.length-1].trim();         
   
    $("nav#sidebar ul li a").each(function(){
    if(last_part==$(this).attr('href').trim()){
    $(this).css({"color": "#000","background" : "#fff"});   
   
    }
    else{
}
});

});
</script>

Comments

Popular posts from this blog

datatable with both top and bottom scroll bar.

Display Loader and disable page while waiting for ajax request

Remove GIT integration from VSCode