一年前,当本人拿到一个名叫TWIG的PHP程序时,立即被作者OOP编程思想所折服,很难想像TWIG中所有的功能(行事历、邮件、个性化)均在一个PHP文件(index.php3)中执行完成,这就得益于作者采用了程序代码与页面构架分离的思想,但是我也看到尽管作者做了很大的努力,但由于PHP的局限性,程序并没有真正做到代码与构架的分离,index.php3这个主文件由于要执行的功能太多,所以其require的模块文件相当之多,至使整个文件依然显得十分零乱,本人愚昧,当时花了半个月的时间,才真正明白程序的构架,分析代码之苦,无人能知啊(黯然泪下......)。
TWIG程序对我此后的编程有着很大的影响,但是即使这样的作品,依然没有摆脱程序代码与HTML代码混杂的局面。
程序代码与页面构架的分离是WEB程序员多年的梦想。在ASP.Net出现之前,无论是ASP、PHP还是JSP,程序代码与HTML代码都是混杂在一起的,这种做法,虽然在WEB技术初期受到赞扬,但是随着时间的的推移,它的弊端是越来越明显,当程序代码很长时,HTML代码与其混杂,程序的可读性变得很差,让人无法分清程序真正要表示的页面构架。
而新技术ASP.Net则通过Codebehind、用户控件(User Control)以及自定义控件(Custom Control)等方法真正做到了代码的分离。这是一个了不起的进步,大家可以在本文中看到分离代码后的ASP.Net程序的结构是多么的清晰。
为了便于理解,这里设计的页面比较简单,页面分为三个主要的部分,头部包含一个AdRotator控件(用于显示广告)与一个Label控件(用于显示当前广告链接地址);中部是一个登陆页面,包括两个TextBox控件(分别用于输入用户名与密码)、一个Label控件(显示登陆是否成功)与一个Button控件(作为提交按钮);底部包含两个Label控件(分别显示当前用户名与用户权限)。
熟悉ASP.Net的朋友,马上就会意识到头部由于使用了AdRotator控件,所以必定存在OnAdCreated事件以便在Label控件显示相应链接;而中部由于使用Button控件做为提交按钮,所以必定有一个OnClick事件处理。
1 CodeBehind
首先我们就看看如何使用CodeBehind方法来实现代码与页面构架的分离,下面给出的源程序是主ASP.Net程序--Example1.aspx:
<% @ Page Src="cs\EventHandle.cs" Inherits="Aspcn" %>
<html>
<head>
<title></title>
</head>
<body>
<form runat="server">
<asp:Panel id="Header" runat="server">
<asp:AdRotator id="ad" AdvertisementFile="AdBanners\ad.xml"
BorderWidth="0" OnAdCreated="
AdCreated" runat="server" /><br>
当前广告链接:<asp:Label id="lblAdText" ForeColor="red" runat="server" />
</asp:Panel>
<asp:Panel id="Logon" runat="server">
<table>
<tr><td colspan="2" align="center"><b>登陆窗口</b></td></tr>
<tr><td colspan="2" align="center"><asp:Label id="lblMsgShow"
ForeColor="red" runat="server" /></td></tr>
<tr><td>用户名:</td><td><asp:TextBox id="tbUserName" runat="server" /></td></tr>
<tr><td>密码:</td><td><asp:TextBox id="tbPasswd" TextMode="Password" runat="server" /></td></tr>
<tr><td><asp:Button id="btnSubmit" Text="登陆" OnClick="Submit_Click" runat="server" /></td></tr>
</table>
</asp:Panel>
<asp:Panel id="Footer" runat="server">
用户名:<asp:Label id="lblUserName" Font-Name="Arial" ForeColor="red" Text="游客" runat="server" />
权限:<asp:Label id="lblPurview" Font-Name="Arial" Text="无" ForeColor="red" runat="server" />
</asp:Panel>
</form>
</body>
</html>
例程中,大家可以清楚地看到程序中不包含任何C#、VB、JavaScript来处理OnAdCreated与OnClick事件,但是执行本程序,程序能够正常使用(如图2-1与图2-2)。这便是使用CodeBehinde的结果,事件处理已经被转移到其它程序中定义执行。请大家注意本例中第一行的信息:
<% @ Page Src="cs\EventHandle.cs" Inherits="Aspcn" %>
一般在ASP.Net程序中,Page指令都在设定本程序应当使用什么语言(使用Language属性),而本例中没有出现Language属性,而是出现了两个新的Page属性:Src与Inherits。Src属性设定事件处理真正的代码位置,Inherits属性则设定需要引入的类名。可以看到本例中定义事件处理的文件是EventHandle.cs,我们来看看它的具体内容: using System;
using System.Data;
using System.Data.SqlClient;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
public class Aspcn : Page
{
//声明Web Form中出现的控件
public Label lblAdText,lblUserName,lblPurview,lblMsgShow;
public TextBox tbUserName,tbPasswd;
public Button btnSubmit;
public AdRotator ad;
private string strConnString = "server=(local)\\Feidao;database=aspcn;Trusted_Connection=yes";
//处理Adrotator控件建立事件
public void AdCreated(Object src,AdCreatedEventArgs e)
{
lblAdText.Text = e.AlternateText;
}
public void Submit_Click(Object sender,EventArgs e)
{
SqlConnection MyConn = new SqlConnection(strConnString);
MyConn.Open();
string strUserName,strPassword,strSelect;
strUserName = tbUserName.Text;
strPassword = tbPasswd.Text;
strSelect = "select * from bbs_user where id='"+strUserName+"'
and password='"+strPassword+"'";
SqlCommand MyComm = new SqlCommand(strSelect,MyConn);
SqlDataReader dr = MyComm.ExecuteReader();
if(dr.Read())
{
//登陆成功
lblMsgShow.Text = "登陆成功";
lblUserName.Text = dr["id"].ToString();
lblPurview.Text = dr["purview"].ToString();
}
else
{
//登陆不成功
lblMsgShow.Text = "登陆不成功";
}
dr.Close();
MyConn.Close();
}
}
进行事件处理是定义在一个类中的(本例中是Aspcn,注意大小写),由于需要与Web Forms相关联,所以此类还必须继承Page类。
分析程序,大家可以看到程序中对事件的处理操作是与普通的未进行代码分离的程序是一样的,并没有什么特别的地方。(本人在程序中已经给出的相关注释,相信对大家理解程序有所帮助)
使用CodeBehind技术后,大家需要多写一些代码,比如声明控件等,也许大家很不喜欢多写这样的代码,但是大家也必须看到使用了CodeBehind技术后,主程序的可读性大大增加了。在Example1.aspx中相信大家很快就可以区分页面构架的各个部分,大家想想这些构架如果在其它技术是否能看得如此清楚?(这里的程序只做演示用,呵呵,大家可不要抓我什么引号漏洞这些小辫子哟)
2 用户控件(UserControl)
CodeBehind技术真正实现了代码与构架的分离,比以前的技术前进了一大步,但是它的缺陷也是显而易见的,比如主页面中部那个登陆区,如果内容很多,HTML显示代码的依然会占用很大的区域,程序的可读性依然会降低。
ASP.Net也提供了解决办法,这就是用户控件。
用户控件我们可以将其视为不用编译的Server控件。即然是控件,那么就肯定会遵从控件的使用方法。我们将Example1.aspx中的每个Panel整体看成为一个控件,因此Example1.aspx的主体部分通过使用用户控件便可以减少为只有三行:
<% @ Register TagPrefix="aspcn" TagName="Header" Src="UserControls/Header.ascx" %>
<% @ Register TagPrefix="aspcn" TagName="Logon" Src="UserControls/Logon.ascx" %>
<% @ Register TagPrefix="aspcn" TagName="Footer" Src="UserControls/Footer.ascx" %>
<html>
<head>
<title></title>
</head>
<body>
<form runat="server">
<aspcn:Header id="MyHeader" runat="server" />
<aspcn:Logon id="MyLogon" runat="server" />
<aspcn:Footer id="MyFooter" runat="server" />
</form>
</body>
</html>
执行这个程序,其运行结果与使用CodeBehind技术的结果是一样的,但是现在的ASP.Net程序更加容易区分页面构架了。
<aspcn:Header id="MyHeader" runat="server" />
<aspcn:Logon id="MyLogon" runat="server" />
<aspcn:Footer id="MyFooter" runat="server" />
这三行代码,使用了三个用户控件,这么少的代码大家一眼就可以清楚的看到页面被分为三个部分。
要使用用户控件就必须使用Register指令,TagPrefix属性定义是的一个Namespace的名字,以保证它在这个页面的唯一性;TagName属性是在定义一个类(class)的别名,由于用户控件执行时是被CLR编译成为类来执行的,所以就必须给本程序中每个用户控件一个唯一的名字,以便于大家区分;Src属性则是具体指出了使用的用户控件的文件名(用户控件均以.ascx结尾)。
用户控件的使用与普通Server控件一样:
<namespace:class ... runat="server" />
namespace表示定义的命名空间,class则是相应的类名,具体的使用例子有:
<aspcn:Logon id="MyLogon" runat="server" />
下面是用户控件显示程序中所使用的用户控件的具体内容:
Header.ascx(Header用户控件)
<Script Language="C#" Runat="Server">
private void AdCreated(Object src,AdCreatedEventArgs e)
{
lblAdText.Text = e.AlternateText;
}
</script>
<asp:AdRotator id="ad" AdvertisementFile="..\AdBanners\ad.xml" BorderWidth="0"
OnAdCreated="AdCreated" runat="server" /><br>
当前广告链接:<asp:Label id="lblAdText" ForeColor="red" runat="server" />
Logon.ascx(