views:

55

answers:

3

My master page has 3 content place holders:

1. left side bar

2. middle content area

3. right side bar

So it looks like:

<div id="left"></div>
<div id="content"></div>
<div id="right"></div>

On a particular view page (.aspx) that inherits the master page, I want to now show #3 (right side bar).

So I don't want the to be rendered at all.

How can I do this?

A: 

There's a few ways you can achieve this depending on what you mean by "render".

One way is to apply an id to each page's body tag and then use CSS to hide the divs you don't want to be 'rendered' using something like

#myPage #right{display:none;}

Alternatively, if by 'render' you mean output in the HTML response then you could replace your divs with a partial view. At run time you could then decide which partial views to include in your page, either as part of a base controller that all controllers inherit or as part of each controller individually.

Using a base controller is one of the ways I replicate general code in a similar way as you might have done in a master pages codebehind in webforms.

Jamie Dixon
A: 

It would be best if you used the content place holders for formatting and placed the actual content inside the .aspx files that inherit from the .master page.

This way you assign your 3 column divs in you master without content but float them left or however you want to format them with your css and use the content reference in your .aspx to place the content into the desired column.

PS. if your looking to create 3 column layout I would suggest using jquerys .ui-layout plug-in instead of trying faux columns, etc..

Byron Cobb
+1  A: 

Another thing to consider is nested master pages. I have a similar design layout I'm doing in a current project, and we have a "base" master page that does all of our script includes, header and footer, and has just a single ContentPlaceHolder that represents everything between the header and footer. We then have a nested master page that uses the base master page, but adds a right "aside" column. For pages where we want the right column visible, we use the nested master page. For pages where we don't want it rendered, we use the base master page.

A strategy like this would definitely prevent your column #3 from being rendered at all (as opposed to being rendered and just being empty, which might not achieve the layout you're going for).

It looks something like this:

Base master page:

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="MasterBase.Master.cs" Inherits="MasterBase" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    ...
    <asp:ContentPlaceHolder ID="head" runat="server" />
</head>

<body>
    <form id="form1" runat="server">
        <!-- HEADER -->
        ...

        <!-- CONTENT -->
        <asp:ContentPlaceHolder ID="bodyContent" runat="server" />

        <!-- FOOTER -->
        ...
    </form>
</body>
</html>

Nested Master Page

<%@ Master Language="C#" MasterPageFile="~/MasterBase.Master" AutoEventWireup="true" CodeBehind="MasterWithColumns.master.cs" Inherits="MasterWithColumns" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <asp:ContentPlaceHolder ID="head" runat="server" />
</asp:Content>


<asp:Content ID="Content2" ContentPlaceHolderID="bodyContent" runat="server">
    <!-- CENTER COLUMN -->
    <div id="centerCol">
        <asp:ContentPlaceHolder ID="bodyContent" runat="server" />
    </div>

    <!-- RIGHT COLUMN -->
    <div id="rightCol">
        <asp:ContentPlaceHolder ID="rightColumn" runat="server" />
    </div>
</asp:Content>
Samuel Meacham