一年前，當本人拿到一個名叫twig的php程序時，立即被作者oop編程思想所折服，很難想像twig中所有的功能（行事歷、郵件、個性化）均在一個php文件(index.php3)中執(zhí)行完成，這就得益于作者采用了程序代碼與頁面構(gòu)架分離的思想，但是我也看到盡管作者做了很大的努力，但由于php的局限性，程序并沒有真正做到代碼與構(gòu)架的分離，index.php3這個主文件由于要執(zhí)行的功能太多，所以其require的模塊文件相當之多，至使整個文件依然顯得十分零亂，本人愚昧，當時花了半個月的時間，才真正明白程序的構(gòu)架，分析代碼之苦，無人能知啊(黯然淚下......)。
twig程序?qū)ξ掖撕蟮木幊逃兄艽蟮挠绊?，但是即使這樣的作品，依然沒有擺脫程序代碼與html代碼混雜的局面。
程序代碼與頁面構(gòu)架的分離是web程序員多年的夢想。在asp.net出現(xiàn)之前，無論是asp、php還是jsp，程序代碼與html代碼都是混雜在一起的，這種做法，雖然在web技術(shù)初期受到贊揚，但是隨著時間的的推移，它的弊端是越來越明顯，當程序代碼很長時，html代碼與其混雜，程序的可讀性變得很差，讓人無法分清程序真正要表示的頁面構(gòu)架。
而新技術(shù)asp.net則通過codebehind、用戶控件(user control)以及自定義控件(custom control)等方法真正做到了代碼的分離。這是一個了不起的進步，大家可以在本文中看到分離代碼后的asp.net程序的結(jié)構(gòu)是多么的清晰。
飛刀借此地向大家演示一下它們的具體實現(xiàn)方法，我們先看看要實現(xiàn)的功能。
為了便于理解，這里設計的頁面比較簡單，頁面分為三個主要的部分，頭部包含一個adrotator控件(用于顯示廣告)與一個label控件(用于顯示當前廣告鏈接地址)；中部是一個登陸頁面，包括兩個textbox控件(分別用于輸入用戶名與密碼)、一個label控件(顯示登陸是否成功)與一個button控件(作為提交按鈕)；底部包含兩個label控件(分別顯示當前用戶名與用戶權(quán)限)。
熟悉asp.net的朋友，馬上就會意識到頭部由于使用了adrotator控件，所以必定存在onadcreated事件以便在label控件顯示相應鏈接；而中部由于使用button控件做為提交按鈕，所以必定有一個onclick事件處理。
1 codebehind
首先我們就看看如何使用codebehind方法來實現(xiàn)代碼與頁面構(gòu)架的分離，下面給出的源程序是主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" />
權(quán)限：<asp:label id="lblpurview" font-name="arial" text="無" forecolor="red" runat="server" />
</asp:panel>
</form>
</body>
</html>
例程中，大家可以清楚地看到程序中不包含任何c#、vb、javascript來處理onadcreated與onclick事件，但是執(zhí)行本程序，程序能夠正常使用(如圖2-1與圖2-2)。這便是使用codebehinde的結(jié)果，事件處理已經(jīng)被轉(zhuǎn)移到其它程序中定義執(zhí)行。請大家注意本例中第一行的信息：
<% @ page src="cs/eventhandle.cs" inherits="aspcn" %>
一般在asp.net程序中，page指令都在設定本程序應當使用什么語言(使用language屬性)，而本例中沒有出現(xiàn)language屬性，而是出現(xiàn)了兩個新的page屬性：src與inherits。src屬性設定事件處理真正的代碼位置，inherits屬性則設定需要引入的類名?？梢钥吹奖纠卸x事件處理的文件是eventhandle.cs，我們來看看它的具體內(nèi)容：
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中出現(xiàn)的控件
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相關聯(lián)，所以此類還必須繼承page類。
分析程序，大家可以看到程序中對事件的處理操作是與普通的未進行代碼分離的程序是一樣的，并沒有什么特別的地方。(本人在程序中已經(jīng)給出的相關注釋，相信對大家理解程序有所幫助)
使用codebehind技術(shù)后，大家需要多寫一些代碼，比如聲明控件等，也許大家很不喜歡多寫這樣的代碼，但是大家也必須看到使用了codebehind技術(shù)后，主程序的可讀性大大增加了。在example1.aspx中相信大家很快就可以區(qū)分頁面構(gòu)架的各個部分，大家想想這些構(gòu)架如果在其它技術(shù)是否能看得如此清楚？
(這里的程序只做演示用，呵呵，大家可不要抓我什么引號漏洞這些小辮子喲)
2 用戶控件(usercontrol)
codebehind技術(shù)真正實現(xiàn)了代碼與構(gòu)架的分離，比以前的技術(shù)前進了一大步，但是它的缺陷也是顯而易見的，比如主頁面中部那個登陸區(qū)，如果內(nèi)容很多，html顯示代碼的依然會占用很大的區(qū)域，程序的可讀性依然會降低。
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>
執(zhí)行這個程序，其運行結(jié)果與使用codebehind技術(shù)的結(jié)果是一樣的，但是現(xiàn)在的asp.net程序更加容易區(qū)分頁面構(gòu)架了。
<aspcn:header id="myheader" runat="server" />
<aspcn:logon id="mylogon" runat="server" />
<aspcn:footer id="myfooter" runat="server" />
這三行代碼，使用了三個用戶控件，這么少的代碼大家一眼就可以清楚的看到頁面被分為三個部分。
要使用用戶控件就必須使用register指令，tagprefix屬性定義是的一個namespace的名字，以保證它在這個頁面的唯一性;tagname屬性是在定義一個類(class)的別名，由于用戶控件執(zhí)行時是被clr編譯成為類來執(zhí)行的，所以就必須給本程序中每個用戶控件一個唯一的名字，以便于大家區(qū)分；src屬性則是具體指出了使用的用戶控件的文件名(用戶控件均以.ascx結(jié)尾)。
用戶控件的使用與普通server控件一樣：
<namespace:class ... runat="server" />
namespace表示定義的命名空間，class則是相應的類名，具體的使用例子有：
<aspcn:logon id="mylogon" runat="server" />
下面是用戶控件顯示程序中所使用的用戶控件的具體內(nèi)容：
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(logon用戶控件)
<% @ import namespace="system.data" %>
<% @ import namespace="system.data.sqlclient" %>
<script language="c#" runat="server">
protected string strconnstring = "server=(local)//feidao;database=aspcn;trusted_connection=yes";
//定義usercontrol的屬性
public string username
{
get
{
return tbusername.text;
}
set
{
tbusername.text = value;
}
}
public string password
{
get
{
return tbpasswd.text;
}
set
{
tbpasswd.text = value;
}
}
//事件處理
private 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 = "登陸成功";
session["username"] = dr["id"].tostring();
session["purview"] = dr["purview"].tostring();
}
else
{
//登陸不成功
lblmsgshow.text = "登陸不成功";
}
dr.close();
myconn.close();
}
</script>
<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>
footer.ascx(footer用戶控件)
<script language="c#" runat="server">
private void page_load(object src,eventargs e)
{
if(session["username"]!=null)
{
lblusername.text = (string)session["username"];
lblpurview.text = (string)session["purview"];
}
}
</script>
用戶名：<asp:label id="lblusername" font-name="arial" forecolor="red" text="游客" runat="server" />
權(quán)限：<asp:label id="lblpurview" font-name="arial" text="無" forecolor="red" runat="server" />
每個控件包含有自已的顯示代碼以及相應的程序代碼。
我們可以將一些常用的功能制作成為固定的用戶控件，當需要時，我們就可直接拿來使用，而不需要使用煩人的crtl+c，ctrl+v來"復制"、"粘貼"長長的一大堆代碼。
用戶控件不僅做到了程序代碼與頁面構(gòu)架的分離，而且還增加了代碼重用性。
3 自定義控件(custom control)
用戶控件是很不錯的選擇，但是由于每個用戶控件都是一個ascx文件，當這些控件很多時，它們的使用就顯得比較零亂。此時我們便想可不可以將一些比較相似的控件整合起來，在程序中只需要引用一次，便全部搞定。這是個很不錯的想法，我們把這個想法說得更加專業(yè)一些："將多個類(class)導入同一個命名空間(namespace)"。呵呵，怎么樣，這句話是不是有點有耳熟？大家快去查一查server控件的定義，是不是發(fā)現(xiàn)這句話是...
我們下面就要接觸如何寫server控件。編寫server控件并不是一件輕松容易的事情，需要對.net平臺有比較深的了解，適合于高級用戶，因此這里本人也不會具體描述server控件的編寫步驟(要細細講這個，非得寫書不可)。請大家比較一下自定義控件源代碼與用戶控件的區(qū)別,作一些大致的了解：
using system;
using system.data;
using system.data.sqlclient;
using system.drawing;
using system.web;
using system.web.ui;
using system.web.ui.webcontrols;
namespace aspcn
{
//首先是header
public class header:control,inamingcontainer
{
private adrotator ad;
private label lbladtext;
protected override void createchildcontrols()
{
//加入adrotator廣告控件
ad = new adrotator();
ad.advertisementfile = "adbanners/ad.xml";
ad.borderwidth = 0;
ad.adcreated += new adcreatedeventhandler(this.onadcreated);
this.controls.add(ad);
this.controls.add(new literalcontrol("<br>"+"當前廣告鏈接為："));
//加入label控件
lbladtext = new label();
lbladtext.forecolor = color.red;
this.controls.add(lbladtext);
}
private void onadcreated(object sender,adcreatedeventargs e)
{
this.lbladtext.text = e.alternatetext;
}
}
//接著是logon
public class logon : control,inamingcontainer
{
private string strconnstring = "server=(local)//feidao;database=aspcn;trusted_connection=yes";
private label lblmsgshow;
private textbox tbusername,tbpasswd;
public string username
{
get
{
return tbusername.text;
}
set
{
tbusername.text = value;
}
}
protected override void createchildcontrols()
{
//添加html標簽
this.controls.add(new literalcontrol("<table><tr><td colspan=/"2/" align=/"center/"><b>登陸窗口</b></td></tr> <tr><td colspan=/"2/" align=/"center/">"));
//添加msgshow label控件
lblmsgshow = new label();
lblmsgshow.forecolor = color.red;
this.controls.add(lblmsgshow);
this.controls.add(new literalcontrol("</td></tr><tr><td>用戶名：</td><td>"));
//添加username與passwd textbox控件
tbusername = new textbox();
this.controls.add(tbusername);
this.controls.add(new literalcontrol("</td></tr><tr><td>密碼：</td><td>"));
tbpasswd = new textbox();
tbpasswd.textmode = textboxmode.password;
this.controls.add(tbpasswd);
this.controls.add(new literalcontrol("</td></tr><tr><td>"));
//添加btnsubmit button控件
button btnsubmit = new button();
btnsubmit.text = "登陸";
btnsubmit.click += new eventhandler(this.submit_click);
this.controls.add(btnsubmit);
this.controls.add(new literalcontrol("</td></tr></table>"));
}
//顯示完畢
private 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())
{
//登陸成功
this.lblmsgshow.text = "登陸成功";
}
else
{
//登陸不成功
this.lblmsgshow.text = "登陸不成功";
}
dr.close();
myconn.close();
}
}
//最后是footer
public class footer : control,inamingcontainer
{
private string _username,_purview;
public string username
{
get
{
return _username;
}
set
{
_username = value;
}
}
public string purview
{
get
{
return _purview;
}
set
{
_purview = value;
}
}
public footer()
{
_username = "游客";
_purview = "無";
}
protected override void createchildcontrols()
{
this.controls.add(new literalcontrol("用戶名："));
label lblusername = new label();
lblusername.forecolor = color.red;
lblusername.font.name = "arial";
lblusername.text = this.username;
this.controls.add(lblusername);
//this.controls.add(new literalcontrol("nbsp;"));
this.controls.add(new literalcontrol("權(quán)限："));
label lblpurview = new label();
lblpurview.forecolor = color.red;
lblpurview.font.name = "arial";
lblpurview.text = this.purview;
this.controls.add(lblpurview);
}
}
}
上面和程序是將需要實現(xiàn)的功能，全部導入了自定義控件。程序中可以看到，在aspcn命名空間中包含三個類(header,logon,footer)，這三個類正是構(gòu)架三個主體部分。
要使用自定義控件，還必須將原代碼進行編譯。
csc /t:library /out:aspcn.dll /r:system.data.dll,system.web.dll,system.drawing.dll customcontrols.cs
c#程序編譯指令的用法，本人在此也不再重復。需要注意的是編譯的文件名，必須與控件中namespace的名字一致。
編譯后的dll，仍然不能使用，我們必須將其放到.net平臺中最著名的目錄--/bin中,bin目錄(如果不存在，可以自行建立)存放的是當前虛擬目錄中所有使用自定義控件以及組件，clr在執(zhí)行asp.net程序時會自動搜索此目錄中的文件，以找到與asp.net程序相匹配的namespace、class 以及assembly。
當我們將程序編譯好的aspcn.dll放入/bin目錄后，這個自己編寫的server控件便可以使用了。
(需要聲明一下，由于編寫server控件時不能使用session等變量，以至無法做到兩個class之間的通信，因此在缺省狀態(tài)下footer控件并不能像前面的程序一樣隨session內(nèi)容發(fā)生改變，不過可以通過普通操作server控件的方法來操作相應的屬性達到相同的效果，此處為節(jié)約版面，未采用)
下面再來看看主體web form的程序內(nèi)容：
<% @ register tagprefix="aspcn" namespace="aspcn" assembly="aspcn" %>
<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>
怎么樣，相當簡單明了吧。
引用我們自定義的控件，也相當簡潔，只需將register指令的tagprefix、namespace、assembly屬性全部設定為aspcn。
至此，asp.net中三種代碼與頁面構(gòu)架分離的方法已經(jīng)介紹完畢。
三種方法各有優(yōu)劣，本人比較傾向于使用用戶控件與codebinde技術(shù)結(jié)合使用，因為他們均不需要編譯，相對來說更容易使用，如果您要保護你的代碼，自定義控件則當然是您最佳的選擇。
希望本文對您的編程有所幫助。
新聞熱點
疑難解答
圖片精選
