ASP.NET 2.0 中的母版页

ASP.NET 2.0 中的母版页

http://blog.csdn.net/spring21st/archive/2008/02/28/2127095.aspx

为了减少在网页设计时出现的变一页则动全站的问题，vs2003升级到vs2005后增加了母版的概念。

　　你可以把它想像成为“网页模版”，与之不同的是，再也不必每个页面都去更新了，修改一次，所有的网页都会改变，做到了一劳永逸。

　　下面先进行一个简单的母版使用演示：

　　1、首先打开visual studio 2005，新建一个asp.net网站，文件系统，C#。

　　2、在解决方案资源管理器中，右键新建一个新项：



　　3、选择母版页：



　　4、打开MasterPage.master，里面有一个contentplaceholder控件，注意不要控件里面写什么东西。

　　我们转到设计视图，在这个控件外面加上header和footer 两句文本。



　　5、保存后我们就可以用它来做其它页面了。有两种方法，1是在母版页任意位置右键，点击添加内容页;2 是在解决方案资源管理器上新建新项，在生成aspx页面时勾选“选择母版页”



　　6、选择相应的母版页



　　7、在新生成的页面源代码只有这几句：

＜%@PageLanguage="C#"MasterPageFile="~/MasterPage.master"AutoEventWireup="true"
　　CodeFile="Default2.aspx.cs"Inherits="Default2"Title="UntitledPage"%＞
＜asp:ContentID="Content1"ContentPlaceHolderID="ContentPlaceHolder1"Runat="Server"＞
＜/asp:Content＞


　　我们可以看到一个content控件，这个东西对应母版页的ContentPlaceHolder1控件，转换到视图页面：



　　8、其中页头和页脚的文字都是灰色的，我们只能在 content中进行编辑。

　　保存后访问default2.aspx这个页面，F5.，我们看到页面：




2、嵌套母版应用
嵌套母版页其实是母版页功能的高级应用，就是在大的母版页中包含一个小的母版页。这里需要注意的是，不管母版页有无嵌套、或者有几个嵌套，整个页面构架中必须至少包含一个内容页，因为母版页本身是不能被用户访问到的。
以下是嵌套母版页应用的简略代码：
大母版页BigMasterPage.master:

< %@ Master Language="C#" AutoEventWireup="true" CodeFile="MainMasterPage.master.cs" Inherits="MainMasterPage" %>

< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

< html xmlns="http://www.w3.org/1999/xhtml" >
< head runat="server">
< title>无标题页< /title>
< /head>
< body>
< form id="form1" runat="server">
< div>大母版页内容< /div>
< div>
< asp:contentplaceholder id="ContentPlaceHolder1" runat="server">
< /asp:contentplaceholder>
< /div>#p#分页标题#e#
< /form>
< /body>
< /html>

大母版和简单应用时的一样，没有什么变动．

小母版页SmallMasterPage.master:

< %@ Master Language="C#" AutoEventWireup="true" CodeFile="SmallMasterPage.master.cs" Inherits="SmallMasterPage" MasterPageFile="~/MainMasterPage.master"%>
< asp:Content ID="SubContent" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
< div>小母版内容< /div>
< div>
< asp:contentplaceholder id="ContentPlaceHolder2" runat="server">
< /asp:contentplaceholder>
< /div>
< /asp:Content>

这里看来小母版其实是一个带有母版标记的特殊内容页而已，Content控件之外只允许存在文件头，和部分程序，拒绝存在html代码等．

内容页：Content.aspx:

< %@ Page Language="C#" MasterPageFile="~/SmallMasterPage.master" AutoEventWireup="true" CodeFile="Content.aspx.cs" Inherits="Content" Title="Untitled Page" %>
< asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder2" Runat="Server">
内容页内容
< /asp:Content>

和简单应用时也一样，不过这里选用的母版是SmallMasterPage.master．
大家着重看蓝色部分哦．运行结果：


3、访问母版页控件及属性
在进行程序设计的时候，我们可能需要在内容页中对母版页进行操控．要访问母版页的的控件或属性有以下几种方法：

一、使用FindControl方法获取母版页控件的引用
利用内容页page对象的Master公共属性，我们可以实现对关联母版页的引用。进而使用母版页的FindControl方法来实现对母版页控件的访问。
母版页MasterPage.master：

< %@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage1.master.cs" Inherits="MasterPage1" %>

< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

< html xmlns="http://www.w3.org/1999/xhtml" >
< head runat="server">
< title>母版页< /title>
< /head>
< body>
< form id="form1" runat="server">
< asp:Label runat="server" ID="masterlabel">母版页的内容< /asp:Label>
< div>
< asp:contentplaceholder id="ContentPlaceHolder1" runat="server">
< /asp:contentplaceholder>
< /div>
< /form>
< /body>
< /html>

内容页Content1.aspx:

< %@ Page Language="C#" MasterPageFile="~/MasterPage1.master" AutoEventWireup="true" CodeFile="content1.aspx.cs" Inherits="content1" Title="Untitled Page" %>
< script runat="server">
void Page_LoadComplete(Object sender, EventArgs e)
{
contentlabel.Text = (Master.FindControl("masterlabel") as Label).Text;
}
< /script>
< asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
< asp:Label ID="contentlabel" runat="server">这里将显示母版页masterlabel控件的内容。< /asp:Label>
< /asp:Content>
其中，“Page_LoadComplete”是内容页面加载完成时触发的一个事件。
运行结果：

二、使用MasterType指令获取母版页控件的引用
相对于上面的FindControl方法而言，MasterType显得很直接。通过使用MasterType，可以创建与母版页的强类型引用。

将FindControl方法例子中的MasterPage.master更改如下：

< %@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage1.master.cs" Inherits="MasterPage1" %>
< script runat="server">
public Label MasterPageLabel//注意：将母版页label控件强类型化，方便内容页访问。对母版页属性的访问也使用该方法。
{
get#p#分页标题#e#
{
return masterlabel;
}
set
{
masterlabel = value;
}
}
< /script>
< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

< html xmlns="http://www.w3.org/1999/xhtml" >
< head runat="server">
< title>母版页< /title>
< /head>
< body>
< form id="form1" runat="server">
< asp:Label runat="server" ID="masterlabel">母版页的内容< /asp:Label>
< div>
< asp:contentplaceholder id="ContentPlaceHolder1" runat="server">
< /asp:contentplaceholder>
< /div>
< /form>
< /body>
< /html>

将FindControl方法例子中的Content1.aspx更改如下：

< %@ Page Language="C#" MasterPageFile="~/MasterPage1.master" AutoEventWireup="true" CodeFile="content1.aspx.cs" Inherits="content1" Title="Untitled Page" %>
< %@ MasterType VirtualPath="~/MasterPage1.master" %>
< script runat="server">
new void Page_Load(Object sender, EventArgs e)
{
contentlabel.Text = Master.MasterPageLabel.Text;
}
< /script>
< asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
< asp:Label ID="contentlabel" runat="server">这里将显示母版页masterlabel控件的内容。< /asp:Label>
< /asp:Content>

4、母版页应用范围配置
以上实例都是页面级母版页应用，只要在对应内容页页面头部声明或设置即可。
如果是程序级母版页应用，应在Web.config中作以下设置：
< configuration>
< system.web>
< pages MasterPageFile="~/MasterPage.master" />
< /system.web>
< /configuration>
屏蔽某个文件夹使用该母版方案，可以通过在该文件夹下放置不同的web.config文件来实现。
屏蔽某个文件使用该母版方案，可以通过设置.aspx页面头部来实现:
< %@ Page Language="C#" MasterPageFile="~/OtherMasterPage.master" %>
如果不想使用母版，可以把MasterPageFile属性值留空即可。

5.
在母版页中使用javascript 时，使用javascript 获得对象，
比如页面现有一个TextBox控件
< asp:TextBox id="userName" runat="server">

使用javascript
var mm=document.all.userName;
报告的错误为对象为空或者对象不存在
查看生成的网页的源码，发现
ID 为userName 的TextBox 被解析为
< input name="_ctl0:_ctl0:DownStageMainContent:DownStagesubContent:userName" type="text" id="_ctl0__ctl0_DownStageMainContent_DownStagesubContent_userName" />
原来加入母版页后会在服务器控件的前面自动添加一个字符串，在这里是_ctl0__ctl0_DownStageMainContent_DownStagesubContent
客户端的控件不受影响
如何获得控件对象呢？
解决方法1
document.getElementById('< %=userName.ClientID %>')

解决方法2
< asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
< script type="text/javascript">
function yanzheng()
{
var tt=document.getElementById("ctl00$ContentPlaceHolder1$mingzi");
tt.value=tt.value.replace(" ","");
if(tt.value=="")
{
window.alert("用户名不能为空！");
return false;
}
tt=document.getElementById("ctl00$ContentPlaceHolder1$xx");
tt.value=tt.value.replace(" ","");
if(tt.value=="")
{
window.alert("密码不能为空！");
return false;
}
}
< /script>
< asp:TextBox ID="mingzi" runat="server" MaxLength="10">< /asp:TextBox>
< asp:TextBox ID="xx" runat="server" MaxLength="10">< /asp:TextBox>
< input id="date" runat="server" maxlength="10" name="date" οnclick="new Calendar().show(this);"
readonly="readonly" size="10" type="text" />
< asp:Button ID="SaveInfo" runat="server" Text="添加" CssClass="but"
OnClientClick="return yanzheng()" />

< /asp:Content>