'How to make the corresponding text bold depending on the URL visited/link clicked in ASP.NET Core?
I have this rather primitive issue, but I have no idea how to solve this:
I have a side hierarchy menu in one of many Razor pages and for now I just manually make the current page bold in the HTML.
- Is there a possibility to automate this?
- What's the best approach for giving the state of the current page?
- Does ASP.NET Core have an integrated function/etc for this?
Here's how my side menu looks like:
<div class="col-sm-2 side-menu" style="">
<ul id="menu-map" class="menu" style="">
<li class=""><a href="/test1" aria-current="page">
<span>TEST1</span>
</a></li>
<li class=""><a href="/test2" aria-current="page">
<span>test2</span>
</a></li>
<li class=""><a href="/test3" aria-current="page">
<span>test3</span>
</a></li>
<li class=""><a href="/test4" aria-current="page">
<span>test4</span>
</a></li>
<li class=""><a href="/test5" aria-current="page">
<span><strong>test5</strong></span>
</a></li>
</ul>
</div>
col-sm-2 is a Bootstrap 4 class, yes.
Another ELI5 example:
In the side menu above if I click on TEST1 the TEST1 gets bold text, if I click on test2, test2 gets bold text on that page. (/test1 and /test2 correspondently)
A CSS solution might kind of work, but what if the user gets a link to one of the pages? Hence a pure CSS solution is not viable in my opinion.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
