problems setting an active css to current page in nav - Using Umbraco 7

Press Ctrl / CMD + C to copy this to your clipboard.

Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at

Brian McNally 13 posts 91 karma points

Jul 18, 2014 @ 19:36
0

Problems setting an "active" css to current page in nav

Using Umbraco 7
I've tried all the solutions I've found in other threads to accomplish this and no luck at all. I think I'm getting further from the solution. I've reverted back to my initial simple nav for now with no active or current css style. Can anyone point me in the right direction?

So far this is my MVC partial View being called onto a page:
```
@inherits Umbraco.Web.Mvc.UmbracoTemplatePage
@{
    Layout = null;
}

@{
    var startNodeId = (int)@ViewData["startNodeId"];
    var pageNode = Umbraco.Content(startNodeId);
}
<ul class="nav nav-pills nav-stacked">
    @foreach (var navPage in pageNode.Children.Where("Visible"))
    {
        <li>
            <a href="@navPage.Url" title="@navPage.pageTitle">@navPage.pageTitle</a>
        </li>
    }
</ul>
```
I'm calling it on a page using the following:
```
@Html.Partial("myNavPartial", new ViewDataDictionary { { "startNodeId", 1450 } })
```
Copy Link
Dan 1285 posts 3917 karma points c-trib

Jul 18, 2014 @ 20:57
0
Hi Brian,

How about this?
```
<li class="@(navPage.IsAncestorOrSelf(Model.Content) ? "active" : null)">
```
Copy Link
Brian McNally 13 posts 91 karma points

Jul 18, 2014 @ 21:06
0
Hi Dan, Thanks so much for the reply. I found a couple different iterations of your suggestion and gave them a try, as well as yours.

It gives me this error on line 11, not sure what I'm missing.

Server Error in '/' Application. Object reference not set to an instance of an object. Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code.

Exception Details: System.NullReferenceException: Object reference not set to an instance of an object.

Source Error:

Line 9:
- @navPage.pageTitle
Copy Link
Andy Butland 422 posts 2334 karma points MVP 4x hq c-trib

Jul 19, 2014 @ 22:39

0

It suggests pageNode hasn't been set properly, perhaps as your ViewData doesn't contain the startNodeId as expected?

Andy

Copy Link
Brian McNally 13 posts 91 karma points

Jul 21, 2014 @ 22:53

0

Not sure I am following you, how would I check that?

Copy Link
Robert Foster 459 posts 1820 karma points MVP 2x admin c-trib

Jul 22, 2014 @ 01:07

0

You could put an if statement in above the foreach loop to make sure that pageNode is a valid object and not just a null value. Alternatively instead of using Umbraco.Content() try using Umbraco.TypedContent() - the latter gives you a concrete IPublishedContent instance, while the former gives you a dynamic version of it. The concrete version will be much easier to test for this kind of thing.

Also, what's the relationship between the hardcoded pageId and the site? Is it possible to arrive at the same content node using the Ancestor/Descendant methods on the Umbraco instance or one of the other methods? You may find it a lot more stable and less prone to breakage if you can do away with hardcoded Node Ids...

- Rob.

Copy Link
James 251 posts 1169 karma points

Jul 22, 2014 @ 12:59

0

Heres how I did it:

Top of my code:

@inherits Umbraco.Web.Mvc.UmbracoTemplatePage

@{

Layout = null;

var active = "active";

var currPageName = Umbraco.Field("pageName").ToString();

}

Navbar:

<ul class="nav navbar-nav">

<li class="@if(currPageName == "Home"){@active}"}>

<a href="/home" class="">

Home

</a>

</li>

</ul>

Probably not the cleanest but maybe you can use the if statement inside your foreach loop?

Kind regards.

Copy Link
is working on a reply...

Please Sign in or register to post replies

Flag this post as spam?

Problems setting an "active" css to current page in nav