Super Sale Limited Time 50% OFF for All-Access Plans
Save 50% Now

Set Active Sidebar Menu when using MVC


When using MVC Route on Sidebarmenu, current page is not activated on the menu. Could you please help?


Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (5)


Answered on previous post, this works for me :

<script>
KTUtil.onDOMContentLoaded(function() {
KTMenu.updateByLinkAttribute(window.location.pathname);
});
</script>



Hi happy,

Glad to hear that happy If you need any further assistance please let us know.

Regards.


Your Support Matters!

We will highly appreciate your Metronic Review on Themeforest.
Please go to Themeforest Downloads page, select Metronic & leave your feedback.

Hi,

I have the same problem: I am applying Metronic theme 8.1.5 to existing MVC 5 application. After clicking on sidebar menu, current page is not activated on menu. I checked ASP.NET Core sample Starterkit and there is the same problem.
How do I use code from the previous post?

Thanks for your answer,
Regards, Valentin



when using with htmx, I am getting "menu-item menu-accordion showing" even when i click on a menu outside the tree ( happens when I click on a nested item, and then click on an outside item ). tried both of these

KTUtil.onDOMContentLoaded(function() {
console.log("active link: " + window.location.pathname);
KTMenu.updateByLinkAttribute(window.location.pathname, "hx-get");
});

document.addEventListener("htmx:afterSwap", function(event) {
console.log("active link: " + window.location.pathname);
KTMenu.updateByLinkAttribute(window.location.pathname, "hx-get");
});


for menu links like this
<a
class="menu-link"
hx-get="/admin"
hx-target="#kt_app_content"
hx-swap="outerHTML"
hx-push-url="true">



when using with htmx, I am getting "menu-item menu-accordion showing" even when i click on a menu outside the tree ( happens when I click on a nested item, and then click on an outside item ). tried both of these

KTUtil.onDOMContentLoaded(function() {
console.log("active link: " + window.location.pathname);
KTMenu.updateByLinkAttribute(window.location.pathname, "hx-get");
});

document.addEventListener("htmx:afterSwap", function(event) {
console.log("active link: " + window.location.pathname);
KTMenu.updateByLinkAttribute(window.location.pathname, "hx-get");
});


for menu links like this
<a
class="menu-link"
hx-get="/admin"
hx-target="#kt_app_content"
hx-swap="outerHTML"
hx-push-url="true">


Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(