ASP.Net+XML打造留言薄
2024-07-10 12:59:34
供稿:網友
 
國內最大的酷站演示中心!
一.概述:
  留言簿是網站的一個重要組成部分,是訪問者發表意見的場所,也是網站管理員了解網站基本運行情況的有力工具,所以留言簿在現在的網站中扮演了十分重要的角色。
  不過在以前開發一個留言簿并不是一件容易的事,開發者的工作量往往會很大。而現在隨著微軟推出vs.net,相應的技術也推陳出新。特別是xml技術在.net framework中的廣泛運用,使得整個.net構架具有十分優越的基礎。而asp.net中推出的嶄新的編程模型更使得開發web應用程序變得非常容易。本文就結合asp.net技術和xml技術的優點向大家介紹如何打造一個屬于自己的留言簿。
  二.實現方法:
  一個基本的留言簿應至少包括兩個功能:接受用戶輸入的信息并保存該信息到后臺數據庫;顯示用戶輸入的信息。用戶輸入的信息一般包括用戶名、email地址、qq號碼、用戶主頁、留言信息等,這些信息通常是保存在后臺數據庫的某個表中的,不過本文要運用一個xml文件來存儲這些信息。顯示用戶輸入的信息時一般得把所有的信息都顯示出來,這里的方法就是從xml文件中讀取數據并運用xslt技術對其進行格式轉換,最后以html的形式顯示在瀏覽器中。
  這樣,我們的留言簿就需要兩個web頁面,一個用于接受用戶的輸入信息,另一個用于顯示用戶已經輸入過的信息。而存儲信息的xml文件(guestbook.xml)則需具有如下的結構:
<?xml version="1.0" encoding="gb2312"?>
<guestbook>
<guest>
<name>令狐沖</name>
<email>[email protected]</email>
<qq>10102350</qq>
<homepage>www.doose.com</homepage>
<comment>本留言簿由"令狐沖"創建,希望你能喜歡哦:)要知道如何創建一個屬于自己的留言簿,那么就請仔細閱讀《運用asp.net和xml技術打造留言簿》一文!</comment>
</guest>
</guestbook> 
  下面我們先來創建用于接受用戶輸入信息的web頁面-guestbook.aspx。根據前面所提的基本要求,該web頁面包括了以下幾個部分:留言簿標題、"用戶名:"標簽及輸入框、"email地址:"標簽及輸入框、"qq號碼:"標簽及輸入框、"個人主頁:"標簽及輸入框、"留言信息:"標簽及輸入框、一個"確定"按鈕、一個"重置"按鈕、一個"查看留言簿"按鈕,同時該頁面還包括了兩個驗證按鈕,分別用于驗證用戶名以及email地址是否為空,若為空,則提醒用戶輸入。同時,為使留言簿具有良好的用戶界面,我運用了表格進行頁面布置,這樣留言簿中的各個成分就能有條有理,層次分明了。有關該web頁面的詳細代碼請參考文后附帶的源代碼,這里就不給出了。頁面布置的圖示如下:
圖1
  完成了該web頁面的布置,我們僅僅是完成了一部分的工作,到此為止我們并沒有進行過真正的編碼。我想大家對asp.net中的代碼后置技術肯定是了解或熟悉的,它將web頁面的布置工作和后端的編碼工作區分開來,達到了良好的分離效果。下面我們就為該web頁面中的三個按鈕分別編寫消息相應函數:
private void btnok_click(object sender, system.eventargs e)
{
savexmldata();
name.text = "";
email.text = "";
qq.text = "";
homepage.text = "";
comment.text = "";
}
private void btnreset_click(object sender, system.eventargs e)
{
name.text = "";
email.text = "";
qq.text = "";
homepage.text = "";
comment.text = "";
}
private void btnview_click(object sender, system.eventargs e)
{
// 顯示所有用戶的留言信息
response.redirect( "viewguestbook.aspx" );
} 
  其中,第一個按鈕是最重要的,它能將用戶的輸入信息存儲到xml文件中,調用的方法就是savexmldata();而第二個按鈕僅僅完成文本框的重置清空工作;第三個按鈕的作用是運用另一個web頁面顯示所有的用戶輸入信息。同時,第一個按鈕在成功保存信息后也會將瀏覽器導向到顯示所有用戶輸入信息的頁面。
  下面我們來詳細分析一下savexmldata()方法,其實現如下:
private void savexmldata()
{
try
{
// 創建一個xmldocument對象,用于載入存儲信息的xml文件
xmldocument xdoc = new xmldocument();
xdoc.load( server.mappath( "guestbook.xml" ));
// 創建一個新的guest節點并將它添加到根節點下
xmlelement parentnode = xdoc.createelement( "guest" );
xdoc.documentelement.prependchild( parentnode );
// 創建所有用于存儲信息的節點
xmlelement namenode = xdoc.createelement( "name" );
xmlelement emailnode = xdoc.createelement( "email" );
xmlelement qqnode = xdoc.createelement( "qq" );
xmlelement homepagenode = xdoc.createelement( "homepage" );
xmlelement commentnode = xdoc.createelement( "comment" );
// 獲取文本信息
xmltext nametext = xdoc.createtextnode( name.text );
xmltext emailtext = xdoc.createtextnode( email.text );
xmltext qqtext = xdoc.createtextnode( qq.text );
xmltext homepagetext = xdoc.createtextnode( homepage.text );
xmltext commenttext = xdoc.createtextnode( comment.text );
// 將上面創建的各個存儲信息的節點添加到guest節點下但并不包含最終的值
parentnode.appendchild( namenode );
parentnode.appendchild( emailnode );
parentnode.appendchild( qqnode );
parentnode.appendchild( homepagenode );
parentnode.appendchild( commentnode );
// 將上面獲取的文本信息添加到與之相對應的節點中
namenode.appendchild( nametext );
emailnode.appendchild( emailtext );
qqnode.appendchild( qqtext );
homepagenode.appendchild( homepagetext );
commentnode.appendchild( commenttext );
// 保存存儲信息的xml文件
xdoc.save( server.mappath( "guestbook.xml" ));
// 顯示所有用戶的留言信息
response.redirect( "viewguestbook.aspx" );
}
catch( exception e ) {}
} 
  該方法主要運用了xmldocument類、xmlelement類以及xmltext類等,這些類都是包含在system.xml命名空間中的,所以請在代碼文件的開頭處添加using system.xml的語句。該方法運用了一個try-catch語句塊,在try部分首先通過創建一個xmldocument對象來載入xml文件,然后創建根節點的兒子-guest節點并在guest節點下添加存儲信息所必須的五個子節點。所有這些子節點都是xmlelement對象,它們是通過xmldocument對象的createelement()方法來獲取的。同時,xmldocument對象還通過createtextnode()方法來獲取文本信息并在后面將其添加到相對應的節點中。在合理的添加guest節點及其子節點以及文本信息后,xmldocument對象通過save()方法將用戶輸入的信息保存到xml文件中。最后,瀏覽器會導向到顯示所有用戶輸入信息的頁面。這樣,該web頁面運行的效果如圖2所示:
圖2
  下面我們來創建用于顯示所有用戶輸入信息的頁面-viewguestbook.aspx。在該web頁面中,我們要運用到xslt技術,它能將前面創建的xml文件中的數據以html的形式顯示出來。由于是運用xslt技術顯示用戶輸入信息的,所以在設計該web頁面時我們無需添加任何web控件,只要重載該web頁面的load()方法即可。
private void page_load(object sender, system.eventargs e)
{
// 創建一個xmldocument對象以載入存儲信息的xml文件
xmldocument xdoc = new xmldocument();
xdoc.load( server.mappath( "guestbook.xml" ));
// 創建一個xsltransform對象并導入xsl文件
xsltransform xslt = new xsltransform();
xslt.load( server.mappath( "guestbook.xsl" ));
string xmlquery = "//guestbook";
xmlnodelist nodelist = xdoc.documentelement.selectnodes( xmlquery );
memorystream ms = new memorystream();
xslt.transform( xdoc, null, ms );
ms.seek( 0, seekorigin.begin );
streamreader sr = new streamreader( ms );
// 顯示輸出結果
response.write( sr.readtoend() );
} 
  該方法首先創建一個xmldocument對象用于載入前面創建的xml數據文件,之后創建一個xsltransform對象并導入相應的xsl文件。通過該xsl文件中的內容它能將原來的xml文件中的數據格式化為html的形式并顯示在瀏覽器中。因為其中運用到了xslt轉換,所以我們還得在代碼文件的開頭處添加using system.xml.xsl的語句。
  下面便是xsl文件的源代碼,其中最重要的部分是<xsl:template match="name">……</xsl:template>一塊。
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/xsl/transform" version="1.0">
<xsl:template match="/">
<table border="1" style="border-collapse: collapse" bordercolor="teal" align="center" width="505" height="34"> 
<tr>
<td valign="middle" align="center" bgcolor="teal" colspan="2" width="505" height="85">
<font style="color:white;background-color:teal;font-family:華文行楷;font-size:x-large;font-weight:bold;">歡迎訪問"令狐沖"的留言簿!</font>
</td>
</tr>
<tr><td width="505" height="26" align="left" colspan="2"></td></tr>
<xsl:for-each select="//guest">
<xsl:apply-templates select="name"/> 
</xsl:for-each>
<tr>
<td valign="middle" align="center" colspan="2" width="505">
<font>
本留言簿由<a href="mailto:[email protected]">王凱明</a>開發! </font>
</td>
</tr>
</table>
</xsl:template>
<xsl:template match="name">
<tr>
<td width="95" height="26" align="right">
<font>用戶名:</font>
</td>
<td width="400" height="26" valign="middle" align="left">
<font><xsl:value-of select='.'/></font>
</td>
</tr>
<tr>
<td width="95" height="26" align="right" bgcolor="e0e0e0">
<font>email地址:</font>
</td>
<td width="400" height="26" valign="middle" align="left" bgcolor="#e0e0e0">
<font><a href="mailto:{../email}"><xsl:apply-templates select="../email"/></a></font>
</td> 
</tr>
<tr>
<td width="95" height="26" align="right">
<font>qq號碼:</font>
</td>
<td width="400" height="26" valign="middle" align="left">
<font><xsl:apply-templates select="../qq"/></font>
</td>
</tr>
<tr>
<td width="95" height="26" align="right" bgcolor="#e0e0e0">
<font>個人主頁:</font>
</td>
<td width="400" height="26" valign="middle" align="left" bgcolor="#e0e0e0">
<font><a href="http://{../homepage}" target="_blank"><xsl:apply-templates select="../homepage"/></a></font>
</td> 
</tr>
<tr>
<td width="95" height="26" valign="top" align="right">
<font>留言信息:</font>
</td>
<td width="400" height="26" valign="top" align="left">
<font><xsl:apply-templates select="../comment"/></font>
</td> 
</tr>
<tr><td width="505" height="26" align="left" colspan="2"></td></tr>
</xsl:template>
</xsl:stylesheet> 
  這樣,當用戶點擊"查看留言簿"按鈕或是成功輸入信息后瀏覽器便導向到該顯示所有用戶輸入信息的web頁面,其運行效果圖示如下:
圖3
  三.總結:
  這樣,一個具有基本功能的留言簿就完成了,從中我們可以體會到運用asp.net技術開發web應用程序是相當容易的,同時在結合了xml技術之后,asp.net可以變得更加強大。還有文章中介紹的xslt技術是非常有用的,你可以參考其它相關的更多資料以使它成為你開發過程中的一個有力工具。