CODEWITHSUNDEEP
asp.net-mvc-4
SidC
SidC

Reputation: 3213

How to Suppress Navigation on Home Page of my MVC4 Application?

I'm using the standard MVC4 template in VS 2012. It came with a _layout.cshtml file which is as follows:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>@ViewBag.Title - iLoveSport</title>
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <meta name="viewport" content="width=device-width" />
    @Styles.Render("~/Content/css")
    @Styles.Render("~/Content/kendo")
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/kendo")
    @Scripts.Render("~/bundles/modernizr")
</head>
<body>
    <header>
        <div class="content-wrapper">
            <div class="float-left">
               <img src="~/Images/logo.png" alt="ILoveSport Logo" />
            </div>
            <div class="float-right">
                <section id="login">

                </section>
                <nav>
                    <ul id="menu">
                        <li>@Html.ActionLink("Home", "Index", "Home")</li>
                        <li>@Html.ActionLink("AFL", "Index", "AFL")</li>
                        <li>@Html.ActionLink("NRL", "Index", "NRL")</li>
                        <li>@Html.ActionLink("State of Origin", "Index", "State of Origin")</li>
                        <li>@Html.ActionLink("Cricket", "Index", "Cricket")</li>
                        <li>@Html.ActionLink("Golf", "Index", "Gof")</li>
                        <li>@Html.ActionLink("Motorsport", "index", "Motorsport")</li>

                        <li>@Html.ActionLink("About", "About", "Home")</li>
                        <li>@Html.ActionLink("Contact", "Contact", "Home")</li>
                    </ul>
                </nav>
            </div>
        </div>
    </header>
    <div id="body">
        @RenderSection("featured", required: false)
        <section class="content-wrapper main-content clear-fix">
            @RenderBody()
        </section>
    </div>
    <footer>
        <div class="content-wrapper">
            <div class="float-left">

            </div>
        </div>
    </footer>

    @Scripts.Render("~/bundles/jquery")
    @RenderSection("scripts", required: false)
</body>
</html>

The _viewstart.cshtml contains the following:

@{
Layout = "~/Views/Shared/_Layout.cshtml";
}

What must be modified so that the navigation in my _layout.cshtml page is suppressed on the home page only? The home page needs to have a button that will then trigger the inner page which is currently my home page. Do I create a new layout file suppressing the menu and change viewstart to load it instead? Or, can this be done via another means?

Thanks for your help and guidance.

Update:
My Home Controller now is as follows:

[ChildActionOnly]
    public ActionResult NavigationMenu()
    {
        string controller = ControllerContext.
            ParentActionViewContext.RouteData.Values["controller"].ToString();
        string action = ControllerContext.
            ParentActionViewContext.RouteData.Values["action"].ToString();

        if (controller == "Home" && action == "Index")
            return Content("");
        else
            return PartialView("_Menu");
    }

My _layout.cshtml is as follows:

<nav>
@Html.Action("NavigationMenu","Partial")
</nav>

However, I receive a debug error stating:

System.Web.HttpException: The controller for path '/' was not found or does not implement IController.

This error is thrown on the layout.cshtml file. How should this be remedied?

Upvotes: 0

Views: 1940

Answers (1)

emre nevayeshirazi
emre nevayeshirazi

Reputation: 19251

You can define your navigation menu as partial view. And render this partial view in your layout.

Inside action method of this partial view, you can check for the controller and action. If it is your home page you can return empty content. Otherwise, return your navigation menu.

Partial View

<nav>
    <ul id="menu">
        <li>@Html.ActionLink("Home", "Index", "Home")</li>
        <li>@Html.ActionLink("AFL", "Index", "AFL")</li>
        <li>@Html.ActionLink("NRL", "Index", "NRL")</li>
        <li>@Html.ActionLink("State of Origin", "Index", "State of Origin")</li>
        <li>@Html.ActionLink("Cricket", "Index", "Cricket")</li>
        <li>@Html.ActionLink("Golf", "Index", "Gof")</li>
        <li>@Html.ActionLink("Motorsport", "index", "Motorsport")</li>

        <li>@Html.ActionLink("About", "About", "Home")</li>
        <li>@Html.ActionLink("Contact", "Contact", "Home")</li>
    </ul>
</nav>

Action Method

[ChildActionOnly]
public ActionResult NavigationMenu()
{
    string controller = ControllerContext.
                               ParentActionViewContext.
                               RouteData.Values["controller"].ToString();

    string action = ControllerContext.
                               ParentActionViewContext.
                               RouteData.Values["action"].ToString();

    if(controller == "Home" && action == "Index")
        return Content("");
    else
        return PartialView("_NavigationPartial");
}

Rendering Partial View

@Html.Action("NavigationMenu", "Partial")

I have not tested the code, but most of it should be fine.

Upvotes: 1

Related Questions