Sidebar menus updateByLinkAttribute > setActive not working properly ( hover and showing not removed ).
I have setup admin dashboard in a dotnet core project and I'm using the following code to make set the active menu properly.
// KTUtil.onDOMContentLoaded(function() {
// console.log("active link: " + window.location.pathname);
// KTMenu.updateByLinkAttribute(window.location.pathname, "hx-get");
// });
btw I'm using htmx for page navigation ( the app is like spa, kt_app_content is being replaced asynchronously. )
when I click on nested menus, the inactive menus still have hover and showing classes. How to get he sidebar menu properly working in async setup ?
Replies (3)
Hi,
Sorry for the late reply.
If you are using our javascript components in your SPA app, instead of calling KTMenu.updateByLinkAttribute in the page load event you can call it within your SPA component's lifecycle events.
For example, in Vue, you can call it from onMounted function, and in React you can call it from useEffect hook.
Regards,
Lauris Stepanovs,
Keenthemes Support Team
Hello I fixed this issue by adding this to
```
var activeItems = [].slice.call(the.element.querySelectorAll('.menu-item.hover, .menu-item.showing'));
activeItems.forEach(function (activeItem) {
if (activeItem.contains(item) === false) {
activeItem.classList.remove("hover");
activeItem.classList.remove("showing");
}
});
```
in _setActiveLink
Hi,
Glad to hear it worked.
Did you modify anything in our menu component?
Regards,
Lauris Stepanovs,
Keenthemes Support Team
