RenderBody, RenderPage and RenderSection methods in MVC 3
原文地址:http://www.codeproject.com/Articles/383145/RenderBody-RenderPage-and-RenderSection-methods-in
RenderBody, RenderPage and RenderSection methods in MVC 3
In this article we will learn about the three methods of MVC 3 and those are RenderBody, RenderPage, andRenderSection. We will learn by the following topics:
RenderBody- What is
RenderBody? - How
RenderBodyworks? RenderBodyExample
- What is
RenderPage- What is
RenderPage? - How
RenderPageworks? RenderPageexample
- What is
RenderSection- What is
RenderPage? - How
RenderPageworks? RenderPageExample
- What is
Now go to in detail…
RenderBody
What is RenderBody?
In layout pages, renders the portion of a content page that is not within a named section. [MSDN]
How RenderBody works (graphical presentation)?
![]()
RenderBody Example
It’s simple. Just create a ASP.NET MVC 3 web application by visual studio 2010. After creating this application, you will see that some files and folders are created by default. After that open the _layout.cshtml file from views/Shared folder. Basically this file will be used as a standard layout for all the page in project. Keep in mind that you can create more then one layout page in a application and to use layout page in other page is optional. The _layout.cshtml file consist the following code.
Collapse | Copy Code<!DOCTYPE html>
<html>
<head>
<title>@ViewBag.Title</title>
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
</head>
<body>
<div class="page">
<div id="header">
<div id="title">
<h1>My MVC Application</h1>
</div>
<div id="logindisplay">
@Html.Partial("_LogOnPartial")
</div>
<div id="menucontainer">
<ul id="menu">
<li>@Html.ActionLink("Home", "Index", "Home")</li>
<li>@Html.ActionLink("About", "About", "Home")</li>
</ul>
</div>
</div>
<div id="main">
@RenderBody()
</div>
<div id="footer">
</div>
</div>
</body>
</html>
Now open another file called index.cshtml from views/home. This file consists of the following code:
Collapse | Copy Code@{
ViewBag.Title = "Home Page";
}
<h2>@ViewBag.Message</h2>
<p>
To learn more about ASP.NET MVC visit <a href="http://asp.net/mvc" title="ASP.NET MVC Website">http://asp.net/mvc</a>.
</p>
Main thing is that by the above code you couldn’t find which layout page is being used by this index page. But there is little tricks done at MVC3. You will get a file called _ViewStart.cshtml at views folder. This file consist of following code.
Collapse | Copy Code@{
Layout = "~/Views/Shared/_Layout.cshtml";
}
This code means that by default all the content pages will follow the _Layout.cshtml layout page. Now if we consolidate the _layout.cshtml and index.cshtml page both, we will get the following code.
Collapse | Copy Code<!DOCTYPE html>
<html>
<head>
<title>Home Page</title>
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
</head>
<body>
<div class="page">
<div id="header">
<div id="title">
<h1>My MVC Application</h1>
</div>
<div id="logindisplay">
@Html.Partial("_LogOnPartial")
</div>
<div id="menucontainer">
<ul id="menu">
<li>@Html.ActionLink("Home", "Index", "Home")</li>
<li>@Html.ActionLink("About", "About", "Home")</li>
</ul>
</div>
</div>
<div id="main"><h2>@ViewBag.Message</h2>
<p>
To learn more about ASP.NET MVC visit <a href="http://asp.net/mvc" title="ASP.NET MVC Website">http://asp.net/mvc</a>.
</p>
</div>
<div id="footer">
</div>
</div>
</body>
</html>
It’s nothing complicated, it’s just replacing the code of RenderBody() of layout page by the code of content page.
if you want to use different layout for different content pages, then create a layout page as like _Layout.cshtml and just copy below code to your desired content page.
Collapse | Copy Code@{
Layout = "another layout page";
}
RenderPage
What is RenderPage?
Renders the content of one page within another page. [MSDN] The page where you will place the content could be layout or normal page.
How RenderPage Works (graphical presentation)?

RenderPage Example
Create a page called _StaticRenderPage at Views/Shared folder. Open it and paste the below code.
Collapse | Copy Code<p>
This messge from render page.
</p>
Open the Index.cshtml file from Views/Home folder and paste the below code.
Collapse | Copy Code@RenderPage("~/Views/Shared/_StaticRenderPage.cshtml")
Now If you merge the code of _StaticRenderPage to Index.cshtml, then you will get the below code.
Collapse | Copy Code@{
ViewBag.Title = "Home Page";
}
<h2>@ViewBag.Message</h2>
<p>
To learn more about ASP.NET MVC visit <a href="http://asp.net/mvc" title="ASP.NET MVC Website">http://asp.net/mvc</a>.
</p>
<p>
This messge from render page.
</p>
If you want to pass the data by using RenderPage, then you have to use the data parameter at RenderPage. I will give another example for this. To do this, at first create a class file called AvailableUser at Models/AccountModels. Create the class with the below code.
Collapse | Copy Codepublic class AvailableUser
{
public string UserName { get; set; }
public string UserPassword { get; set; } public static List<AvailableUser> AllUsers()
{
List<AvailableUser> userList = new List<AvailableUser>(); AvailableUser user1 = new AvailableUser
{
UserName = "Anupam Das",
UserPassword = "lifeisbeautiful",
}; AvailableUser user2 = new AvailableUser
{
UserName = "Chinmoy Das",
UserPassword = "GoodTime",
}; userList.Add(user1);
userList.Add(user2); return userList;
}
}
Now go to AccountController and write down the below code
Collapse | Copy Codepublic ActionResult AvailableUserList()
{
return View(MvcApplication1.Models.AvailableUser.AllUsers());
}
Create a view page called AvailableUserList.cshtml at Views/Account with the below code.
Collapse | Copy Code@model IEnumerable<MvcApplication1.Models.AvailableUser>
@{
ViewBag.Title = "AvailableUserList";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>AvailableUserList</h2>
@RenderPage("~/Views/Shared/_DisplayAllUsers.cshtml", new { AvailableUser = Model })
At last create another view page called _DisplayAllUsers at Views/Shared with the below code.
Collapse | Copy Code@foreach (var usr in Page.AvailableUser)
{
<text>
@usr.UserName @usr.UserPassword <br />
</text>
}
Now run the project (Account/AvailableUserList) and see the user list which comes from AvailableUser class.
RenderSection
What is RenderSection?
In layout pages, renders the content of a named section. [MSDN]
How RenderSection Works (graphical presentation)?

RenderSection Example
It’s simple, just add the below code at _layout page.
Collapse | Copy Code@RenderSection("Bottom",false)
and add the below code at Index page.
Collapse | Copy Code@section Bottom{
This message form bottom.
}
That’s all. But keep in mind that if you don’t want to use the Bottom section in all page then must use the false as second parameter at RenderSection method. If you will mention it as false then it will be mandatory to put Botton section at every content page.
Now run the project and see how it works !!!
I will be happy, if you found anything wrong or know more please share it via comments.
RenderBody, RenderPage and RenderSection methods in MVC 3的更多相关文章
- RenderBody,RenderPage和RenderSection
1. RenderBody 在Razor引擎中没有了“母版页”,取而代之的是叫做“布局”的页面(_Layout.cshtml)放在了共享视图文件夹中.在这个页面中,会看到<body>标签里 ...
- [转]MVC Razor模板引擎 @RenderBody、@RenderPage、@RenderSection及Html.RenderPartial、Html.RenderAction
本文参考自下面文章整理 MVC Razor模板引擎 @RenderBody.@RenderPage.@RenderSection及Html.RenderPartial.Html.RenderActio ...
- ASP.NET MVC之Layout布局与@RenderBody、@RenderPage、@RenderSection
@RenderBody @RenderBody是布局页(_Layout.cshtml)通过占位符@RenderBody占用独立部分,当创建基于此布局页的试图时,视图的内容会和布局页合并,而新创建的视图 ...
- 《ASP.NET MVC4 WEB编程》学习笔记------RenderBody,RenderPage,RenderSection
ASP.NET MVC 3 已经正式发布了,现在估计许多人都在拼命学,我也不能例外,刚刚看到了一篇文章,介绍了三个非常有用的方法:RenderBody,RenderPage和RenderSection ...
- Razor引擎学习:RenderBody,RenderPage和RenderSection
ASP.NET MVC 3 已经正式发布了,现在估计许多人都在拼命学,我也不能例外,刚刚看到了一篇文章,介绍了三个非常有用的方法:RenderBody,RenderPage和RenderSection ...
- Mvc4_ActionLink跟@RenderBody ,@RenderPage
. @Html.ActionLink("该链接要显示的文字A","对应的控制器方法B");会生成:<a href="C/B">A ...
- MVC Razor模板引擎 @RenderBody、@RenderPage、@RenderSection及Html.RenderPartial、Html.RenderAction
一.Views文件夹 -> Shared文件夹下的 _Layout.cshtml 母版页 @RenderBody 当创建基于_Layout.cshtml布局页面的视图时,视图的内容会和布局页面合 ...
- MVC View显示详解(RenderBody,RenderPage,RenderSection,Partial)
一.Views文件夹 -> Shared文件夹下的 _Layout.cshtml 母版页 @RenderBody 当创建基于_Layout.cshtml布局页面的视图时,视图的内容会和布局页面合 ...
- MVC 中 Razor引擎学习:RenderBody,RenderPage和RenderSection
RenderBody 在Razor引擎中没有了“母版页”,取而代之的是叫做“布局”的页面(_Layout.cshtml)放在了共享视图文件夹中.在这个页面中,会看到 标签里有这样一条语句: @Rend ...
随机推荐
- Linux设备驱动——内核定时器
内核定时器使用 内核定时器是内核用来控制在未来某个时间点(基于jiffies)调度执行某个函数的一种机制,其实现位于 <Linux/timer.h> 和 kernel/timer.c 文件 ...
- linux命令之partprobe
使用fdisk工具只是将分区信息写入到磁盘,如果需要使用mkfs格式化并使用分区,则需要重新启动系统.partprobe 是一个可以修改kernel中分区表的工具,可以使kernel重新读取分区表而不 ...
- javascript:void(0)知多少
在做页面时,如果想做一个链接点击后不做任何事情,或者响应点击而完成其他事情,可以设置其属性 href = "#",但是,这样会有一个问题,就是当页面有滚动条时,点击后会返回到页面顶 ...
- 阿里云linux的nginx下面配置多站点
假设有服务器ip为 114.214.85.35 域名1为 www.jieshendada.cn 域名2为 www.jieshenxiaoxiao.cn 1.首先打开nginx域名配置文件存放目录:/ ...
- 单篇文章JS模拟分页
废话部分 前两天做了一个前台分页插件,支持ajax读取数据绑定前台 和 url带页码参数跳转两种方式.于是稍加改动,做了一个单篇文章js模拟分页的代码,为什么说是模拟分页呢?因为在服务器响应HTML请 ...
- (转)__dopostback的用法 .
在.NET中,所有的服务器控件提交到服务器的时候,都会调用__doPostBack这个函数,所以灵活运用这个函数对于我们的帮助还是很大的. 比如,在我们写程序的时候经常会需要动态的生成一些 ...
- (转)jQuery Validate 表单验证
在做网页表单时时常需要在客户端对表单填写的数据进行验证一番才能提交,我们可以通过自己编写JavasScript代码来验证,但是有时数据量过多时就会有些难度了.基于jQuery的jquery.valid ...
- 怎样取得数组对象和arralist 的长度
数组用length属性 ArrayList用size()方法
- 高放的c++学习笔记之重载运算与类型转换
▲基本概念 (1)重载运算符是具有特殊名字的函数,它们的名字又operator和其后要定义的运算符号共同构成.. (2)对于一个运算符号来说它或者是类的成员,或者至少含有一个类类型的参数. (3)我们 ...
- jquery中的replaceWith()和html()有什么区别?
区别在于,html()会替换指定元素内部的HTML,而replaceWith()会替换元素本身及其内部的HTML. 例子: 1 <div id="myid" /> 1 ...