Cache page without the navbar. User log-in/logout system doesn't update at all (MVC)

Question

I'm trying to cache a page without the navbar of the page. When i cache the page its all works fine but I get unwanted behavior.

Explanation:

When I cache the index page for example, the navbar is also cached so if the user press the log-in button and log-on, the user redirect to the same page (Index) and the log-in doesn't take affect (the user name and the log out button doesn't appear), the log-in and register buttons still shows, its a problem.

This is my code:

Home Controller:

public class HomeController : Controller
{
    [OutputCache(Duration=(60*60))]
    public ActionResult Index()
    {
        return View();
    }
    // ...
}

Can I do Vary by something to prevent it ?

Answer 1

I manage to find the solution using "haim770" guidelines.

The solution using the "Donut-Caching" (https://github.com/moonpyk/mvcdonutcaching)

1.first I get the "Donut Caching from the NuGet Packages.

2.I switched in the _layout.cshtml page the line : @Html.Partial("_LoginPartial") with @Html.Action("partialView", true)

3.Than I build an Action inside the Account controller called "partialView" that return the view I wanted, like this :

public ActionResult partialView()
    {
        return PartialView("_LoginPartial");
    }

4.After it I decorated the Action that return the index page with

[DonutOutputCache(Duration=(60*60))]

like this:

  [DonutOutputCache(Duration=(60*60))]
    public ActionResult Index()
    {
        return View();
    }

And you done, Thanks again to Haim(Chaim).