MVC Child Master page with Razor - asp.net

I have an old MVC2 project that I gradulately convert to MVC 5, with Razor.
As the razor views with ASP Master Pages is not possible, I decided to duplicate the Site.Master into _Layout.cshtml.
Everything is OK But there is a problem, however.
I have an other Master page, TwoColumnsLayout.Master, a kind of "child" master page, that begins like this:
<%# Master MasterPageFile="~/Views/Shared/Site.Master" Language="C#" Inherits="System.Web.Mvc.ViewMasterPage" %>
<asp:Content ContentPlaceHolderID="MetaContent" runat="server">
<asp:ContentPlaceHolder ID="MetaContent" runat="server" />
</asp:Content>
<asp:Content ContentPlaceHolderID="HeadContent" runat="server">
<asp:ContentPlaceHolder ID="HeadContent" runat="server" />
</asp:Content>
<asp:Content ContentPlaceHolderID="MainContent" runat="server">
<div class="breadcrumbs">
...
How is possible to convert and use this one with the Razor engine?

utilize #{ Layout = ""; } feature.
For Example:
~/Views/Shared/_LayoutMain.cshtml:
<html>
<head>
<link href="..." rel="stylesheet" type="text/css" />
</head>
<body>
<!-- header markup -->
#RenderBody()
<!-- footer markup -->
</body>
</html>
~/Views/Shared/_LayoutChild.cshtml:
#{
Layout = "~/Views/Shared/_LayoutMain.cshtml";
}
<!-- Child Layout content -->
<div>
#RenderBody()
</div>
~/Views/MyPage/_SomeViewPage.cshtml:
#{
Layout = "~/Views/Shared/_LayoutChild.cshtml";
}
<div>
#RenderBody()
</div>

You just need to use nested layout templates instead.
Create another layout _TwoColumnsLayout.cshtml with the following:
#{
Layout = "~/Shared/_Layout.cshtml";
}
//Nested specific markup ...
#RenderBody()
Then in your view specify your new nested template as follows:
#{
Layout = "~/Shared/_TwoColumnsLayout.cshtml.cshtml";
}

Related

ASP.NET ContentPage with Form Controls

I created a content page that references a master page. In the content page I have a form and some form controls with a submit button. When I hit submit though the parameters are not detected on page load in the content page. On top of that the name of the parameters are all messed up.
What is the correct way of adding form controls to the content page and then using Request.QueryString[ID]?
I just realized that Microsoft throws all kinds of extra crap at you when you use master pages. It is absolutely ridiculous, is there a way for me not to go down this route of using all kinds of silly casting and inefficient overhead:
http://www.asp.net/web-forms/tutorials/master-pages/control-id-naming-in-content-pages-cs
My code (MASTER PAGE):
<%# Master Language="C#" AutoEventWireup="true" ClientIDMode="Static" %>
<!DOCTYPE html>
<html lang="en">
<head runat="server">
<title></title>
<asp:ContentPlaceHolder ID="Head" runat="server"></asp:ContentPlaceHolder>
</head>
<body>
<asp:ContentPlaceHolder runat="server" ID="MainContent" />
</body>
</html>
My code (Content Page):
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server">
<label for="iSiteId">Site Id(s)</label>
<asp:TextBox ID="iSiteId" runat="server"></asp:TextBox>
<label for="iVersion">Version(s)</label>
<asp:TextBox ID="iVersion" runat="server"></asp:TextBox>
</asp:Content>
My Code (Content Page but the Code behind)
_siteId = Request.QueryString["iSiteId"];
_categoryId = Request.QueryString["iCategoryId"];
_version = Request.QueryString["iVersion"];
Try these instead:
siteId = iSiteId.Text;
_categoryId = iCategoryId.Text;
_version = iVersion.Text;

adding css class in content pages

I am working on a page which is using a Master page for some default design,
I need some css class to be added to the conent page, which we add normally in script tag in normal pages,
My question is how to add some css content in a page which is using Master page,
Thanks,
Vishal.
In your master page you can add a content area within the <head> block. We call ours "HeadContent".
Our master page's head block looks like this:
<head>
...
<asp:ContentPlaceHolder ID="HeadContent" runat="server" />
</head>
From your content pages you can then include custom scripts/css etc:
<asp:Content runat="server" ID="Head" ContentPlaceHolderID="HeadContent">
<script type="text/javascript" src="<%= Url.Content("~/scripts/gradebook.js") %>"></script>
<style type="text/css">
#import url('<%= Url.Content("~/styles/gradebook.css") %>');
</style>
</asp:Content>
You could add a ConentPlaceHolder in the head area of your masterpage like this:
<head>
....
<asp:ContentPlaceHolder id="PlaceHolderAdditionalPageHead" runat="server" />
</head>
In your content page you just need a content control:
<asp:Content ID="Content1" ContentPlaceHolderID="PlaceHolderAdditionalPageHead" runat="Server">
// Put your css stuff here
</asp:Content>

Inline jquery script to a separate js file with asp.net master pages

Hai guys,
How to include inline jquery scripts used in an aspx to a separate js file with asp.net master pages
Your masterpage can have a script link to the core Jquery file:
<html>
<head runat="server" >
<title>Master page title</title>
//link to Jquery script
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<asp:contentplaceholder id="Head" runat="server" />
</head>
<body>
.
<asp:contentplaceholder id="Main" runat="server" />
.
</body>
ASPX page can have other script links specific to the page only
<% # Page Language="C#" MasterPageFile="~/Master.master" Title="Content Page 1" %>
<asp:Content ID="Content1" ContentPlaceHolderID="Head" Runat="Server">
//other scripts specific to this page only
<script type="text/javascript" src="js/jquery.plugin.abc.js"></script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="Main" Runat="Server">
Main content.
</asp:Content>

Filling in parent master page from child

I'd like to have a page that uses a child master page, fill in a content placeholder of the parent, but I cannot get it to work. Whenever I try I get the error "Cannot find ContentPlaceHolder 'customHead' in the master page '/templates/info.master', verify content control's ContentPlaceHolderID attribute in the content page."
I have a master page (/templates/main.master) defined like this:
<%# Master Language="C#" %>
<head runat="server">
<title>foo</title>
<asp:contentplaceholder runat="server" id="customHead" />
</head>
<body>
<div id="content">
<asp:contentplaceholder runat="server" id="masterContent" />
</div>
Then I have a child master (/templates/info.master) defined like this:
<%# Master Language="C#" MasterPageFile="/templates/main.master" %>
<asp:content id="homeContent" contentPlaceHolderId="masterContent" Runat="server">
<div id="info-container">
<div id="info-content">
<asp:contentplaceholder runat="server" id="infoContent"/>
</div>
</div>
</asp:content>
And finally my page defined like this:
<%# Page Language="C#" MasterPageFile="/templates/info.master" %>
<asp:Content ID="head" ContentPlaceHolderID="customHead" runat="server">
<!-- Custom header area -->
<link rel="stylesheet" type="text/css" href="foo.css"/>
</asp:Content>
<asp:Content ID="content" ContentPlaceHolderID="childContent" runat="server">
This is my child content
</asp:Content>
You didn't define a "customeHead" in your child master page. If you want to expose the root master pages content area, you'll need to expose it in the child master page.
<%# Master Language="C#" MasterPageFile="/templates/main.master" %>
<asp:contentplaceholder runat="server" id="customHead" />
<asp:content id="homeContent" contentPlaceHolderId="masterContent" Runat="server">
<div id="info-container">
<div id="info-content">
<asp:contentplaceholder runat="server" id="infoContent"/>
</div>
</div>
</asp:content>
Are you setting it using this.Page.Master ?

ContentPlaceHolders: Repeated Content

Scenario
I have an application using asp.net Master Pages in which I would like to repeat some content at the top and bottom of a page. Currently i use something like this:
Master Page
<html>
<body>
<asp:ContentPlaceHolder ID="Foo" runat="server">
</asp:ContentPlaceHolder>
<!-- page content -->
<asp:ContentPlaceHolder ID="Bar" runat="server">
</asp:ContentPlaceHolder>
</body>
</html>
Content Page
<asp:Content ID="Top" ContentPlaceHolderID="Foo" runat="server">
<!-- content -->
</asp:Content>
<asp:Content ID="Bottom" ContentPlaceHolderID="Bar" runat="server">
<!-- content repeated -->
</asp:Content>
Maintenance
As you know, repeating things in code is usually not good. It creates maintenance problems. The following is what I would like to do but will obviously not work because of the repeated id attribute:
Master Page
<html>
<body>
<asp:ContentPlaceHolder ID="Foo" runat="server">
</asp:ContentPlaceHolder>
<!-- page content -->
<asp:ContentPlaceHolder ID="Foo" runat="server">
</asp:ContentPlaceHolder>
</body>
</html>
Content Page
<asp:Content ID="Top" ContentPlaceHolderID="Foo" runat="server">
<!-- content (no repetition) -->
</asp:Content>
Possible?
Is there a way to do this using asp.net webforms? The solution does not necessarily have to resemble the above content, it just needs to work the same way.
Notes
I am using asp.net 3.0 in Visual Studio 2008
Hey, if someone still needs a solution for this here is what I did:
Put it in the Code File of your master page
protected override void RenderChildren(HtmlTextWriter writer)
{
Control mainPlaceHolder = FindControl("MainContentPlaceHolder");
Control doublePlaceHolder = FindControl("ContentDoublePlaceHolder");
StringBuilder sb = new StringBuilder();
using (StringWriter sw = new StringWriter(sb))
using (HtmlTextWriter tw = new HtmlTextWriter(sw))
{
mainPlaceHolder.RenderControl(tw);
}
LiteralControl lc = new LiteralControl(sb.ToString());
doublePlaceHolder.Controls.Add(lc);
base.RenderChildren(writer);
}
I'm not sure about performance issues here, but it certainly works.
In the case where you just want to repeat a string, this worked for me:
<asp:ContentPlaceHolder ID="TitleContent" runat="server" />
Can be referenced elsewhere as:
<% Dim title As LiteralControl = TitleContent.Controls.Item(0)
Response.Write(title.Text)
%>
No warranty on that being the right course of action though :)
As others have said, depending on the content itself there are shortcuts that can be taken depending on the type of content that will be there.
Assuming however you need the "content" to be fully functioning asp.net code then I would suggest a UserControl for each ContentPage that contains the content itself and then you only need to duplicate one line of code.
Example
Master Page
<html>
<body>
<asp:ContentPlaceHolder ID="Foo" runat="server">
</asp:ContentPlaceHolder>
<!-- page content -->
<asp:ContentPlaceHolder ID="Bar" runat="server">
</asp:ContentPlaceHolder>
</body>
</html>
Content Page
<asp:Content ID="Top" ContentPlaceHolderID="Foo" runat="server">
<uc1:Page1Control id="page1Control1" runat="server" />
</asp:Content>
<asp:Content ID="Bottom" ContentPlaceHolderID="Bar" runat="server">
<uc1:Page1Control id="page1Control2" runat="server" />
</asp:Content>
You can create a COMMON user control for the same and add it to your master page in the top & bottom. You can create a property describing whether the control has loaded at the top or bottom.
Depending on the content you may be able to do this in code. If its just HTML just put it in a variable and assign it to the other. If you have controls, you can loop over the controls collection and create a duplicate control and place it in the other area. In either case the second location would not be a contentplaceholder a div should due.

Resources