jjnguy
jjnguy

Reputation: 138874

How can I set the <body> class based on the view in Asp.Net MVC?

I'm looking to set the <body> class as well based on the view.

I've read a few posts about strongly typing the master page but none seem to exactly fit, or at least I don't know how to code it.

I have noticed that Stack Overflwow does it, so it must be possible.

Updated:

Getting error: Description: An error occurred during the compilation of a resource required to service this request. Please review the following specific error details and modify your source code appropriately.

Compiler Error Message: CS1061: 'System.Web.Mvc.HtmlHelper' does not contain a definition for 'Body' and no extension method 'Body' accepting a first argument of type 'System.Web.Mvc.HtmlHelper' could be found (are you missing a using directive or an assembly reference?) on the body line

namespace MySite.Helpers
{
    public static class HtmlHelpers
    {
        public static MvcHtmlString Body(this HtmlHelper htmlHelper)
        {
            string currentControllerName = (string)htmlHelper.ViewContext.RouteData.Values["controller"];
            string currentActionName = (string)htmlHelper.ViewContext.RouteData.Values["action"];
            string css = currentControllerName + "-" + currentActionName;
            var body = new TagBuilder("body");
            body.AddCssClass(css);
            return MvcHtmlString.Create(body.ToString(TagRenderMode.StartTag));
        }
    }

}

~/Views/Shared/Site.Master:

<%@ Master Language="C#" Inherits="System.Web.Mvc.ViewMasterPage" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title><asp:ContentPlaceHolder ID="TitleContent" runat="server" /></title>
    <link href="../../Content/Site.css" rel="stylesheet" type="text/css" />
</head>

<body id="argh" class="<%= Html.Body() %>">

Upvotes: 2

Views: 2310

Answers (2)

Gaff
Gaff

Reputation: 5657

You could do something like the following in your layout cshtml file:

<body class="@HttpContext.Current.Request.RequestContext.RouteData.Values["controller"].ToString().ToLower() @HttpContext.Current.Request.RequestContext.RouteData.Values["controller"].ToString().ToLower()[email protected]["action"].ToString().ToLower()">

which would render to:

<body class="controller controller-action">

That should allow you to write page specific css or whatever you plan to use it for. Of course, you can consolidate all of that code into a method if you feel it is too long.

Upvotes: 0

Darin Dimitrov
Darin Dimitrov

Reputation: 1038780

You could use a helper method:

public static MvcHtmlString Body(this HtmlHelper htmlHelper)
{
    string currentControllerName = (string)helper.ViewContext.RouteData.Values["controller"];
    string currentActionName = (string)helper.ViewContext.RouteData.Values["action"];
    string css = GetCss(currentControllerName, currentActionName);
    var body = new TagBuilder("body");
    body.AddCssClass(css);
    return MvcHtmlString.Create(body.ToString(TagRenderMode.StartTag));
}

And then in your master page:

<%= Html.Body() %>
    ...
</body>

Upvotes: 3

Related Questions