[翻译]带进度条的文件上传控件

ASP.NET File Upload with Progress Bar
英文源文档 <http://www.codeproject.com/KB/webforms/FileUploadWithProgrss.aspx>
翻译：白水  引用请注明出处 <敏捷学院>

 源代码下载：http://dev.mjxy.cn/a-With-the-progress-of-file-upload-controls.aspx

 

介绍

文件上传，实时显示文件上传进度。

背景知识

允许用户上传，下载删除文件以及经典的用户界面而不需要重新加载页面。

 

代码使用

上传部件包含下面内容：

• 文件上传接口(default.aspx)
  • IFRAME(包含上传引擎页UploadEngine.aspx)
  • 上传按钮(允许用户上传文件到服务器)
  • 显示上传文件的统计信息(文件名，状态，进度和传送字节)
  • 隐藏字段(它将监视和刷新文件列表，直到文件成功上传到服务器)

• 上传引擎(UploadEngine.aspx)
  • 文件上传控件

  

页面内容(Default.aspx)

  

上传引擎(UploadEngine.aspx)

 

 

 

页面执行流程

当页面加载时，它会自动注册上传按钮的单击事件。

 

 

 

1. 选择要上传的文件

2. 单击 上传按钮
   • 以下功能是在客户端的一些基本验证
     • 上传文件不允许为空
     • 文件名必须唯一
   • 使用JavaScript事件执行UploadEngine
   • 当执行Uploadengine时有两个过程是同时进行的
     • 页面将使用UploadDetails类在会话中维护文件上传的详细信息
     • 每隔500毫秒，PageMethod将更新显示当前上传进度，文件大小和百分比值。
   • 使用StartProgress显示实时的进度条。

 

 

      
      3. 显示实时的进度条

 

 

 

    4. 更新结果信息，可以包含如下信息：
       成功，信息，警告和错误

 

 

     5. 有两过程同时在服务器端执行
        上传引擎

 

Default

 

 

 

 

6. 下面图像显示的是上传文件的过程 

 

 

    7. 删除和下载

 

 

8. 我提供了经典的外观感觉和跨浏览器支持的脚本(JavaScript)。

9. 这个上传部件支持下面的浏览器：