Anthem.NET(我的介紹和比較,還有一篇)剛剛發(fā)布了其最新的1.5版本,其中很不錯的一個(gè)新功能就是對文件上傳功能的Ajax實(shí)現。本文將簡(jiǎn)要介紹一下該功能的使用方法。
Anthem.NET的下載與安裝
Anthem.NET可以在此下載:http://sourceforge.net/project/showfiles.php?group_id=151897&package_id=168043&release_id=493609
下載之后解壓縮至硬盤(pán)中的某一目錄中,編譯項目得到Anthem.dll。然后將其拷貝到Web站點(diǎn)的bin目錄下:

打開(kāi)Web站點(diǎn)的Web.config文件,在configuration>\ <system.web>\ <pages>\ <controls>中添加如下一行,注冊Anthem.NET控件:
<add tagPrefix="anthem" namespace="Anthem" assembly="Anthem"/>
Anthem.NET提供了一套自己就帶有Ajax功能的、繼承于現有ASP.NET控件的服務(wù)器端控件。根據上面在web.config文件中的注冊,這部分控件的前綴為anthem。
Anthem.NET支持ASP.NET 1.1和ASP.NET 2.0,不過(guò)本文的示例程序均基于A(yíng)SP.NET 2.0。
普通的ASP.NET文件上傳
先看一下普通的ASP.NET文件上傳功能的實(shí)現,代碼如下:
<asp:FileUpload ID="defaultFileUpload" runat="server" />
<asp:Button ID="defaultUploadButton" runat="server"
OnClick="defaultUploadButton_Click" Text="Upload" />
<asp:Label ID="defaultResultLabel" runat="server" Text=""></asp:Label>
后臺代碼,只是簡(jiǎn)單地將文件名和文件大小顯示出來(lái):
protected void defaultUploadButton_Click(object sender, EventArgs e)
{defaultResultLabel.Text = string.Format("File \"{0}\" uploaded ({1} bytes).",
defaultFileUpload.FileName,
defaultFileUpload.FileBytes.Length
);
}
Anthem.NET的Ajax文件上傳
Anthem.NET中的Ajax文件上傳功能靠的是其自己的FileUpload控件,其實(shí)使用起來(lái)和普通的ASP.NET FileUpload控件差不多,下面是HTML部分的代碼:
<anthem:FileUpload ID="anthemFileUpload" runat="server" />
<anthem:Button ID="anthemUploadButton" TextDuringCallBack="uploading..." EnabledDuringCallBack="false"
runat="server" Text="Upload" OnClick="anthemUploadButton_Click" />
<anthem:Label ID="anthemResultLabel" runat="server" Text=""></anthem:Label>
注意控件的前綴都是anthem。那個(gè)Button的TextDuringCallBack屬性設置了異步回送時(shí)按鈕中的文本;EnabledDuringCallBack屬性讓該按鈕在進(jìn)行異步回送時(shí)禁用,免得用戶(hù)等得不耐煩。
后臺代碼同樣是將文件名和文件大小顯示出來(lái),不過(guò)注意這一句anthemResultLabel.UpdateAfterCallBack = true;,用來(lái)在回調之后更新anthemResultLabel上的文字:
protected void anthemUploadButton_Click(object sender, EventArgs e)
{anthemResultLabel.Text = string.Format("File \"{0}\" uploaded ({1} bytes).",
anthemFileUpload.FileName,
anthemFileUpload.FileBytes.Length
);
anthemResultLabel.UpdateAfterCallBack = true;}
示例程序演示
示例程序的界面如下,上面部分是普通的ASP.NET文件上傳,下面是Anthem.NET的Ajax文件上傳:

使用普通的ASP.NET文件上傳,可以看到頁(yè)面有一次閃爍,不過(guò)上傳功能沒(méi)什么問(wèn)題:

而使用下面部分的Anthem.NET的Ajax文件上傳,可以看到上傳時(shí)的界面(按鈕禁用,文本變化):

上傳完成之后,沒(méi)有頁(yè)面閃爍:

打開(kāi)Fiddler看看HTTP請求,上面的是傳統上傳,下面是Ajax的,差別顯而易見(jiàn)……

代碼下載
本文提到的完整的示例程序代碼:http://www.cnblogs.com/Files/dflying/AnthemNETFileUploadDemo.zip
更多參考資料
Anthem.NET官方網(wǎng)站:http://sourceforge.net/projects/anthem-dot-net/
Anthem.NET在線(xiàn)文檔:http://anthem-dot-net.sourceforge.net/docs/
Anthem.NET在線(xiàn)示例程序:http://anthem.talloaksoftware.com/Default.aspx
Fiddler官方網(wǎng)站:http://www.fiddlertool.com/
聯(lián)系客服