Setting active class on a menu item

Working with the Daemonites on some mega-app. This little snippet (h/t @justincarter) for setting an active flag on a menu change took my fancy :slight_smile:

#(url.bodyview == "displayBody")?"active":""#

It checks the body view for the page and assigns active if it matches.

Here’s a snippet in the context of the menu markup:

<li class="#(url.bodyview == "displayBody")?"active":""#"><a href="#application.fapi.getlink(type="tv2gallery", objectid=stobj.objectid, bodyview="displayBody")#" title="Grid View"><span class="access-hide">Grid View</span><span class="fa fa-fw fa-th"></span></a></li>
<li class="#(url.bodyview == "displayBodyList")?"active":""#"><a href="#application.fapi.getlink(type="tv2gallery", objectid=stobj.objectid, bodyview="displayBodyList")#" title="List View"><span class="access-hide">List View</span><span class="fa fa-fw fa-list"></span></a></li>

Enjoy!

1 Like

I just started doing this myself, and I think I like it. :slight_smile:

<!--- Variables, logic etc
//////////////////////////////////////////////////////////////////////////// --->
<cfset myElmClasses = request.currentSection IS "someAlias" ? "active" : "" />

<!--- Output: HTML content
//////////////////////////////////////////////////////////////////////////// --->
<a href="#application.fapi…#" class="#myElmClasses#">My link</a>