Service Portal : How to add active class to a Navigation menu (Left side) based on URL.

[raja_5]

Hi Experts,

When we’re creating a navigation menu for a website, it’s always good to highlight to user on which page or part of the site he is on. This can be accomplished by adding an “active class” or “current class” to the menu item that links to the page on which the visitor or user is.

Below is the code that I am using but its not working as expected,

window.onload = function(){
	var linkactive=0;
	angular.element(".ib_link").each(function(link,value) {
            var currentElement = value;
            var curls = currentElement.getAttribute("href");
            var mainurl = window.location.host + "/customportal";
            var geturl = window.location.href.split(mainurl)[1];
            if ((curls === geturl.split("&")[0] || geturl === "") && linkactive == 0) {
				linkactive=1;
                currentElement.parentElement.classList.add("active");
				currentElement.parentElement.classList.add("liselected");
				if(typeof(currentElement.parentElement.parentElement.parentElement) !== 'undefined'){
					currentElement.parentElement.parentElement.parentElement.classList.add("open");
				}
            }
			currentElement.addEventListener("click", function () {	
				var activeItem = document.querySelector(".liselected");
				activeItem.classList.remove("active");
				activeItem.classList.remove("liselected");
				this.parentElement.classList.add("active");
				this.parentElement.classList.add("liselected");
				if(typeof(this.parentElement.parentElement.parentElement) !== 'undefined'){
					this.parentElement.parentElement.parentElement.classList.add("open");
				}
		})

    });

 

};

Your valuable suggestions would be great help!