详解NeatUpload上传控件的使用
NeatUpload用于文件上传。可传大文件。目前最新版本：NeatUpload-1.3.21。
官方网站：http://www.brettle.com/neatupload
NeatUpload下载地址：http://www.51aspx.com/CV/NeatUpload/
演示地址：http://www.brettle.com/Demo.aspx
1.在VS工具箱中点右键选“选择项”…… 将Brettle.Web.NeatUpload.dll添加到工具箱。




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

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

3.修改Web.config
  1. <configuration> 
  2.  
  3.     <configSections> 
  4.         <sectionGroup name="system.web"> 
  5.             <section name="neatUpload" type="Brettle.Web.NeatUpload.ConfigSectionHandler, Brettle.Web.NeatUpload" allowLocation="true" /> 
  6.         </sectionGroup> 
  7.     </configSections> 
  8.  
  9.     <appSettings/> 
  10.     <connectionStrings/> 
  11.  
  12.     <system.web> 
  13.         <neatUpload useHttpModule="false" maxNormalRequestLength="4096" maxRequestLength="2097151" defaultProvider="FilesystemUploadStorageProvider"> 
  14.             <providers> 
  15.                 <add name="FilesystemUploadStorageProvider" 
  16.                 type="Brettle.Web.NeatUpload.FilesystemUploadStorageProvider, Brettle.Web.NeatUpload" /> 
  17.             </providers> 
  18.         </neatUpload> 
  19.         <compilation debug="false"> 
  20.         </compilation> 
  21.         <authentication mode="Windows" /> 
  22.         <httpModules> 
  23.             <!--如果不加这httpmodules，进度条不显示--> 
  24.           <add name="UploadHttpModule" type="Brettle.Web.NeatUpload.UploadHttpModule, Brettle.Web.NeatUpload"/> 
  25.         </httpModules> 
  26.     </system.web> 
  27.     <location path="Default.aspx" > 
  28.         <system.web> 
  29.             <neatUpload useHttpModule="true" /> 
  30.             <httpRuntime maxRequestLength="2097151" executionTimeout="3600" useFullyQualifiedRedirectUrl="true" /> 
  31.         </system.web> 
  32.     </location> 
  33. </configuration>
复制代码
现在可以拖拽控件开始编程了。

4.aspx页面代码如下：
  1. <head runat="server"> 
  2.     <title> NeatUpload </title> 
  3.     <script type="text/javascript" language="javascript"> 
  4.       function ToggleVisibility(id, type) 
  5.       { 
  6.           el = document.getElementById(id); 
  7.           if(el.style) 
  8.           { 
  9.               if(type == 'on') 
  10.               { 
  11.                   el.style.display = 'block'; 
  12.               } 
  13.               else 
  14.               { 
  15.                   el.style.display = 'none'; 
  16.               } 
  17.           } 
  18.           else 
  19.           { 
  20.               if(type == 'on') 
  21.               { 
  22.                   el.display = 'block'; 
  23.               } 
  24.               else 
  25.               {       
  26.                   el.display = 'none'; 
  27.               } 
  28.           } 
  29.       } 
  30.   </script> 
  31. </head> 
  32. <body> 
  33.     <form id="form1" runat="server"> 
  34.     <div> 
  35.         <Upload:InputFile ID="AttachFile" runat="server" /> 
  36.   <asp:Button ID="Upload" runat="server" Text="Upload" 
  37.             OnClientClick="ToggleVisibility('ProgressBar','on')" onclick="Upload_Click" /> 
  38.       <div id="ProgressBar" > 
  39.       <Upload:ProgressBar ID="pbProgressBar" runat='server' Inline="true" Width="280px" 
  40.               Height="50px"> 
  41.       </Upload:ProgressBar> 
  42.   </div> 
  43.   </div> 
  44.     </form> 
  45. </body> 
  46. </html> 
复制代码
设计页面如下：



5.按钮事件处理函数：
  1. protected void Upload_Click(object sender, EventArgs e) 
  2.         { 
  3.             string FileName = this.AttachFile.FileName;//获取上传文件的全路径 
  4.             string ExtenName = System.IO.Path.GetExtension(FileName);//获取扩展名 
  5.             string SaveFileName = System.IO.Path.Combine(Request.PhysicalApplicationPath, DateTime.Now.ToString("yyyyMMddhhmm") + ExtenName);//合并两个路径为上传到服务器上的全路径 
  6.             if (this.AttachFile.ContentLength > 0) 
  7.             { 
  8.                 try 
  9.                 { 
  10.                     this.AttachFile.MoveTo(SaveFileName, Brettle.Web.NeatUpload.MoveToOptions.Overwrite); 
  11.                 } 
  12.                 catch (Exception ex) 
  13.                 { 
  14.                     throw ex; 
  15.                 } 
  16.             } 
  17.         } 
复制代码
做到这里程序就可以运行的了。
默认的进度条的样式是可以修改的。




default.css修改部分：

  2. .ProgressDisplay .ProgressBar { 
  3.       background-color: #D7E5F7; 
  4.       background-image: url("/11.gif"); /*进度条背景图片*/ 
  5.       height:20px; 
  6. } 
  7. #normalInProgress{ 
  8.     color: Red;      /*进度条字体颜色*/ 
  9. } 
  10. #completed{ 
  11.     color:Blue;  /*上传完成的字体颜色*/ 
  12. } 
  13. Progress.aspx是显示进度条的核心文件，相关数据的显示都在里面。
  14. <td id="barTd" > 
  15.               <div id="statusDiv" runat="server" class="StatusMessage"> 
  16.  
  17.                   <Upload:DetailsSpan id="normalInProgress" runat="server" WhenStatus="NormalInProgress" style="font-weight: normal; white-space: nowrap;">                                <%--  正在上传时显示的  --%> 
  18.                   <%-- <%# FormatCount(BytesRead) %>/<%# FormatCount(BytesTotal) %> <%# CountUnits %> --%> 
  19.                   (<%# String.Format("{0:0%}", FractionComplete) %>) at <%# FormatRate(BytesPerSec) %> 
  20.                   <%-- - <%# FormatTimeSpan(TimeRemaining) %> left        --%> 
  21.                   </Upload:DetailsSpan> 
  22.  
  23.                   <Upload:DetailsSpan id="chunkedInProgress" runat="server" WhenStatus="ChunkedInProgress" style="font-weight: normal; white-space: nowrap;">       
  24.                     <%# FormatCount(BytesRead) %> <%# CountUnits %> 
  25.                       at <%# FormatRate(BytesPerSec) %> 
  26.                       - <%# FormatTimeSpan(TimeElapsed) %> elapsed 
  27.                   </Upload:DetailsSpan> 
  28.                   <Upload:DetailsSpan id="completed" runat="server" WhenStatus="Completed"> 
  29.                       <%--  上传完成时显示的  --%> 
  30. 完成了: <%# FormatCount(BytesRead) %> <%# CountUnits %> 
  31.                       at <%# FormatRate(BytesPerSec) %> 
  32.                       took <%# FormatTimeSpan(TimeElapsed) %> 
  33.                   </Upload:DetailsSpan> 
  34.                   <Upload:DetailsSpan id="cancelled" runat="server" WhenStatus="Cancelled"> 
  35.                       Cancelled! 
  36.                   </Upload:DetailsSpan> 
  37.                   <Upload:DetailsSpan id="rejected" runat="server" WhenStatus="Rejected"> 
  38.                       Rejected: <%# Rejection != null ? Rejection.Message : "" %> 
  39.                   </Upload:DetailsSpan> 
  40.                   <Upload:DetailsSpan id="error" runat="server" WhenStatus="Failed"> 
  41.                       Error: <%# Failure != null ? Failure.Message : "" %> 
  42.                   </Upload:DetailsSpan> 
  43.                   <Upload:DetailsDiv id="barDetailsDiv" runat="server" UseHtml4="true" 
  44.                         Width='<%# Unit.Percentage(Math.Floor(100*FractionComplete)) %>' class="ProgressBar"></Upload:DetailsDiv> 
  45.               </div> 
  46.         </td> 
复制代码
程序的效果图如下：
上传前：



上传中：



上传结束：
posted on 2010-04-29 22:35  好高务远  阅读(1291)  评论(1)    收藏  举报
博客园  ©  2004-2025
浙公网安备 33010602011771号 浙ICP备2021040463号-3