NeatUpload上传大文件有进度条

分类：.Net知识问答| 发布：camnprbubuol| 查看： | 发表时间：2011/1/17

本控件不能在WebForm下运行，不然会出错:Brettle.Web.NeatUpload.MoveToOptions.Overwrite

MoveToOptions没有引用

1.在VS工具箱中点右键选“选择项”…… 将Brettle.Web.NeatUpload.dll添加到工具箱。

2.新建web项目。将NeatUpload复制到项目根目录。

3.修改Web.config

在<configuration>里面加入

XML/HTML Code复制内容到剪贴板

1. <configSections>
2. <sectionGroup name="system.web">
3. <section name="neatUpload" type="Brettle.Web.NeatUpload.ConfigSectionHandler, Brettle.Web.NeatUpload" allowLocation="true" />
4. </sectionGroup>
5. </configSections>
6.  

在 <system.web>加入

XML/HTML Code复制内容到剪贴板

1. <neatUpload useHttpModule="false" maxNormalRequestLength="4096" maxRequestLength="2097151" defaultProvider="FilesystemUploadStorageProvider">
2. <providers>
3. <add name="FilesystemUploadStorageProvider"
4. type="Brettle.Web.NeatUpload.FilesystemUploadStorageProvider, Brettle.Web.NeatUpload"
5. />
6. </providers>
7. </neatUpload>
8.  

在<configuration>里面的后面位置加入

XML/HTML Code复制内容到剪贴板

1. <location path="Default.aspx" >
2. <system.web>
3. <neatUpload useHttpModule="true" />
4. <httpRuntime maxRequestLength="2097151" executionTimeout="3600" useFullyQualifiedRedirectUrl="true" />
5. </system.web>
6. </location>
7. </configuration>

为了使ProgreessBAR能显示，在配置文件<system.web>中需要加入

XML/HTML Code复制内容到剪贴板

1. <httpRuntime useFullyQualifiedRedirectUrl="true" />
2. <httpModules>
3. <add name="UploadHttpModule" type="Brettle.Web.NeatUpload.UploadHttpModule, Brettle.Web.NeatUpload" />
4. </httpModules>
5.  

按钮事件处理函数：

C# Code复制内容到剪贴板

1. using System;  
2. using System.Collections.Generic;  
3. using System.Linq;  
4. using System.Web;  
5. using System.Web.UI;  
6. using System.Web.UI.WebControls;  
7.  
8. public partial class _Default : System.Web.UI.Page  
9. {  
10. protected void Page_Load(object sender, EventArgs e)  
11.     {  
12.  
13.     }  
14. protected void Button1_Click(object sender, EventArgs e)  
15.     {  
16.  
17. string FileName = this.AttachFile.FileName;//获取上传文件的全路径
18.  
19. string ExtenName = System.IO.Path.GetExtension(FileName);//获取扩展名
20.  
21. string SaveFileName = System.IO.Path.Combine(Request.PhysicalApplicationPath + @"\download", DateTime.Now.ToString("yyyyMMddhhmm") + ExtenName);//合并两个路径为上传到服务器上的全路径
22.  
23. if (this.AttachFile.ContentLength > 0)  
24.         {  
25.  
26. try
27.             {  
28.  
29. this.AttachFile.MoveTo(SaveFileName, Brettle.Web.NeatUpload.MoveToOptions.Overwrite);  
30.  
31.             }  
32.  
33. catch (Exception ex)  
34.             {  
35.  
36. throw ex;  
37.  
38.             }  
39.  
40.         }  
41.  
42.     }  
43.  
44. }  

做到这里程序就可以运行的了。

默认的进度条的样式是可以修改的。

主要修改default.css、Progress.aspx及ProgressBar控件的属性。

default.css修改部分：

CSS Code复制内容到剪贴板

1. .ProgressDisplay .ProgressBar {  
2.  
3. background-color: #D7E5F7;  
4.  
5. background-image: url("/11.gif"); /*进度条背景图片*/
6.  
7. height:20px;  
8.  
9. }  
10.  
11. #normalInProgress{  
12.  
13. color: Red;      /*进度条字体颜色*/
14.  
15. }  
16.  
17. #completed{  
18.  
19. color:Blue;   /*上传完成的字体颜色*/
20.  
21. }  
22.  

效果图：

Progress.aspx是显示进度条的核心文件，相关数据的显示都在里面。

XML/HTML Code复制内容到剪贴板

1. <td id="barTd" >
2.  
3. <div id="statusDiv" runat="server" class="StatusMessage">
4.  
5.  
6.  
7. <Upload:DetailsSpan id="normalInProgress" runat="server" WhenStatus="NormalInProgress" style="font-weight: normal; white-space: nowrap;"> <%--  正在上传时显示的   --%>
8.  
9. <%-- <%# FormatCount(BytesRead) %>/<%# FormatCount(BytesTotal) %> <%# CountUnits %> --%>
10.  
11.                   (<%# String.Format("{0:0%}", FractionComplete) %>) at <%# FormatRate(BytesPerSec) %>
12.  
13. <%-- - <%# FormatTimeSpan(TimeRemaining) %> left        --%>
14.  
15. </Upload:DetailsSpan>
16.  
17.  
18.  
19. <Upload:DetailsSpan id="chunkedInProgress" runat="server" WhenStatus="ChunkedInProgress" style="font-weight: normal; white-space: nowrap;">
20.  
21. <%# FormatCount(BytesRead) %> <%# CountUnits %>
22.  
23.                        at <%# FormatRate(BytesPerSec) %>
24.  
25.                        - <%# FormatTimeSpan(TimeElapsed) %> elapsed  
26.  
27. </Upload:DetailsSpan>
28.  
29. <Upload:DetailsSpan id="completed" runat="server" WhenStatus="Completed">
30.  
31. <%--  上传完成时显示的   --%>
32.  
33. 完成了: <%# FormatCount(BytesRead) %> <%# CountUnits %>
34.  
35.                        at <%# FormatRate(BytesPerSec) %>
36.  
37.                        took <%# FormatTimeSpan(TimeElapsed) %>
38.  
39. </Upload:DetailsSpan>
40.  
41. <Upload:DetailsSpan id="cancelled" runat="server" WhenStatus="Cancelled">
42.  
43.                        Cancelled!  
44.  
45. </Upload:DetailsSpan>
46.  
47. <Upload:DetailsSpan id="rejected" runat="server" WhenStatus="Rejected">
48.  
49.                        Rejected: <%# Rejection != null ? Rejection.Message : "" %>
50.  
51. </Upload:DetailsSpan>
52.  
53. <Upload:DetailsSpan id="error" runat="server" WhenStatus="Failed">
54.  
55.                        Error: <%# Failure != null ? Failure.Message : "" %>
56.  
57. </Upload:DetailsSpan>
58.  
59. <Upload:DetailsDiv id="barDetailsDiv" runat="server" UseHtml4="true"
60.  
61. Width=’<%# Unit.Percentage(Math.Floor(100*FractionComplete)) %>’ class="ProgressBar"></Upload:DetailsDiv>
62.  
63. </div>
64.  
65. </td>

现在可以拖拽控件开始编程了。

XML/HTML Code复制内容到剪贴板

1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
2.  
3. <%@ Register Assembly="Brettle.Web.NeatUpload" Namespace="Brettle.Web.NeatUpload"
4. TagPrefix="Upload" %>
5. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
6. <html xmlns="http://www.w3.org/1999/xhtml">
7. <head runat="server">
8. <title></title>
9.  
10. <script type="text/javascript" language="javascript">
11.  
12.         function ToggleVisibility(id, type) {  
13.  
14. el = document.getElementById(id);  
15.  
16.             if (el.style) {  
17.  
18.                 if (type == ’on’) {  
19.  
20. el.style.display = ’block’;  
21.  
22.                 }  
23.  
24.                 else {  
25.  
26. el.style.display = ’none’;  
27.  
28.                 }  
29.  
30.             }  
31.  
32.             else {  
33.  
34.                 if (type == ’on’) {  
35.  
36. el.display = ’block’;  
37.  
38.                 }  
39.  
40.                 else {  
41.  
42. el.display = ’none’;  
43.  
44.                 }  
45.  
46.             }  
47.  
48.         }  
49.  
50. </script>
51.  
52. </head>
53. <body>
54. <form id="form1" runat="server">
55. <div>
56. <Upload:InputFile ID="AttachFile" runat="server" />
57. <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
58. <Upload:ProgressBar ID="ProgressBar1" runat="server">
59. </Upload:ProgressBar>
60. </div>
61. </form>
62. </body>
63. </html>

可以在添加后的工具箱看到相应控件。