本文转自:http://www.ironspeed.com/articles/Maintain%20File%20Upload%20Control/Article.aspx

Introduction

For security reasons, the File Upload control does not save the posted file name in its View State, so the file is lost on postback.  This is not a bug; it was designed this way so the file cannot be hijacked.  Even Iron Speed’s technical support application has this behavior (compare Fig. 1 and Fig. 2).  For most programmers, the issue is not a big problem.  People with less programming background, however, may become annoyed if their input data gets lost again and again.  During the development of one of my projects, I received so many complaints about the issue that I had to find a solution.

Figure 1. File Upload control with a posted file.

Figure 2.  The posted file is lost on postback after "Add Attachment" is clicked.

Solution

I borrowed my idea for a solution from Google Mail (Gmail).  Gmail allows an email to have multiple files attached.  When you attach more than one file, the previously posted files are shown as text links (Fig. 3).  This can also be accomplished in Iron Speed Designer.

Although the File Upload control cannot save the posted file in its View State, the file can be saved in a session variable for later use.  Its name can be displayed in a Literal control.  Here is the design.

  1. Hide a Literal control behind the File Upload control.
  2. On postback, if the File Upload control contains a file, set the file name to the Literal control. Show the Literal control, and hide the File Upload control.
  3. Save the posted file to a session variable, since it will be needed when the record is saved.

Figure 3.  Gmail's work-around for multiple attachments.

Implementation

Step 1: Add a Literal control to TableControlRow Drag and drop a Literal control (non data-bound) alongside the File Upload control (Fig. 4).  Name it "FilePath".  Note the hidden control "ATCH_FILENM" stores the file name to the database, and the FileDeleteButton. The FileDeleteButton removes the posted file and cancels its upload.

Figure 4.  Add a Literal control alongside the File Upload control.

Step 2: Add a PreRender event handler to switch the visibilities of the controls In the MyTableControlRow class (in file: ...\<App Name>\App_Code\MyFolder\MyPage.Controls.cs or .vb), insert the following code.

C#:

public MyTableControlRow(){     PreRender += new EventHandler(MyTableControlRow_PreRender); }

private void MyTableControlRow_PreRender(object sender, EventArgs e){     if(ATCH_FILE.PostedFile != null && ATCH_FILE.PostedFile.FileName.Length > 0){         // Save PostedFile to a session variable         Page.Session[FilePath.ClientID] = ATCH_FILE.PostedFile;

// Also set filename to ATCH_FILENM         string fullPath = ATCH_FILE.PostedFile.FileName;         int LastIndex = fullPath.LastIndexOf("\\");         ATCH_FILENM.Text = fullPath.Substring((LastIndex + 1));     }

// Show Literal if PostedFile is in the session variable.     if(Page.Session[FilePath.ClientID] != null) {         FilePath.Text = ((HttpPostedFile)Page.Session[FilePath.ClientID]).FileName;         FilePath.Visible = true;         ATCH_FILE.Visible = false;     }else{ // Otherwise, show the FileUpload         FilePath.Visible = false;         ATCH_FILE.Visible = true;     } }

Visual Basic .NET:

Public Sub New()     AddHandler PreRender, AddressOf MyTableControlRow_PreRender End Sub

Private Sub MyTableControlRow_PreRender(ByVal sender As Object, _     ByVal e As EventArgs)     If Not ATCH_FILE.PostedFile Is Not Nothing AndAlso _         ATCH_FILE.PostedFile.FileName.Length > 0 Then         ‘ Save PostedFile to a session variable         Page.Session(FilePath.ClientID) = ATCH_FILE.PostedFile

‘ Also set filename to ATCH_FILENM         Dim fullPath As String = ATCH_FILE.PostedFile.FileName         Dim LastIndex As Integer = fullPath.LastIndexOf("\\")         ATCH_FILENM.Text = fullPath.Substring((LastIndex + 1))     End If

‘ Show Literal if PostedFile is in the session variable.     If Not Page.Session(FilePath.ClientID) Is Not Nothing then         FilePath.Text = _             (DirectCast(Page.Session(FilePath.ClientID), HttpPostedFile)).FileName         FilePath.Visible = True         ATCH_FILE.Visible = False     Else         ‘ Otherwise, show the FileUpload         FilePath.Visible = False         ATCH_FILE.Visible = True     End If End Sub

Step 3: Override FileDeleteButton_Click event handler While still in the MyTableControlRow class, add the following code to remove the posted file from the session if the user discards the file.

C#:

public override void FileDeleteButton_Click(object sender, ImageClickEventArgs args){     base.FileDeleteButton_Click(sender, args);     this.Visible = false;     this.Page.Session.Remove(FilePath.ClientID); }

Visual Basic .NET:

Public Overloads Overrides Sub FileDeleteButton_Click(ByVal sender As Object, ByVal args As ImageClickEventArgs)     MyBase.FileDeleteButton_Click(sender, args)     Me.Visible = False     Me.Page.Session.Remove(FilePath.ClientID) End Sub

Step 4: Override GetUIData() for uploading the file Again in the MyTableControlRow class, insert the following code.

C#:

public override void GetUIData(){     HttpPostedFile file = null;     if (ATCH_FILE.PostedFile != null &&         ATCH_FILE.PostedFile.FileName.Length > 0 &&         ATCH_FILE.PostedFile.ContentLength > 0)         file = ATCH_FILE.PostedFile;     else         file = Page.Session[FilePath.ClientID] as HttpPostedFile;

if(file != null){         DataSource.Parse(MiscUtils.GetFileContent(file), MyTable.ATCH_FILE);         DataSource.Parse(HttpUtility.HtmlDecode(ATCH_FILENM.Text),           MyTable.ATCH_FILENM);     } }

Visual Basic .NET:

Public Overloads Overrides Sub GetUIData()     Dim file As HttpPostedFile = Nothing     If Not ATCH_FILE.PostedFile Is Not Nothing AndAlso _         ATCH_FILE.PostedFile.FileName.Length > 0 AndAlso _         ATCH_FILE.PostedFile.ContentLength > 0 Then         file = ATCH_FILE.PostedFile     Else         file = TryCast(Page.Session(FilePath.ClientID), HttpPostedFile)     End If

If Not file is Not Nothing Then         DataSource.Parse(MiscUtils.GetFileContent(file), MyTable.ATCH_FILE)         DataSource.Parse(HttpUtility.HtmlDecode(ATCH_FILENM.Text), _           MyTable.ATCH_FILENM)     End If End Sub

Step 5: Rebuild and run Here is what it looks like (Fig. 5).

Figure 5. Upload multiple files in Iron Speed Designer generated app.

Conclusion

Although the File Upload control cannot save the posted file in its View State, the file can be saved in a session variable for later use.  Its name can be displayed in a Literal control.

About the Author

Jing Ding has a PhD in Computer Engineering, Bioinformatics and Computational Biology, and an M.S. in Toxicology from Iowa State University. He received his B.S. in biophysics from Fundan University in Shanghai, China. He is a self-taught programmer who "played" with assembly, C and C++ in the 1990s. He took a break from programming from 1997 to 2000. When he picked it up again in 2001, he worked with Java. Jing began working with C# and .NET in 2006. 
   
 

[转]Maintain File Upload Control on Postbacks的更多相关文章

  1. jQuery File Upload 单页面多实例的实现

    jQuery File Upload 的 GitHub 地址:https://github.com/blueimp/jQuery-File-Upload 插件描述:jQuery File Upload ...

  2. jQuery File Upload done函数没有返回

    最近在使用jQuery File Upload 上传图片时发现一个问题,发现done函数没有callback,经过一番折腾,找到问题原因,是由于dataType: ‘json’造成的,改为autoUp ...

  3. kindeditor多图片上传找不到action原来是private File upload成员变量惹得祸

    kindeditor多图片上传找不到action原来是private File upload成员变量惹得祸

  4. 【转发】Html5 File Upload with Progress

    Html5 File Upload with Progress               Posted by Shiv Kumar on 25th September, 2010Senior Sof ...

  5. 用jQuery File Upload做的上传控件demo,支持同页面多个上传按钮

    需求 有这么一个需求,一个form有多个文件要上传,但又不是传统的图片批量上传那种,是类似下图这种需求,一开始是用的swfupload做的上传,但是问题是如果有多个按钮的话,就要写很多重复的代码,于为 ...

  6. jquery file upload 文件上传插件

    1. jquery file upload 下载 jquery file upload Demo 地址:https://blueimp.github.io/jQuery-File-Upload/ jq ...

  7. jQuery File Upload跨域上传

    最近在做一个一手粮互联网项目,方案为前后端分离,自己负责前端框架,采用了Requirejs+avalonjs+jquery三个框架完成. 前后端通过跨域实现接口调用,中间也发现了不少问题,尤其是在富文 ...

  8. 《Play for Java》学习笔记(六)文件上传file upload

    一. Play中标准方法 使用表单form和multipart/form-data的content-type类型. 1.Form @form(action = routes.Application.u ...

  9. jquery ajax发送delete(use in jquery file upload delete file)

    环境: jQuery file upload HTML example code <div class="pic-preview"> <div class=&qu ...

随机推荐

  1. Apache Spark GraphX

    GraphX基于BSP模型,在Spark之上封装类似Pregel的接口,进行大规模同步全局的图计算,尤其是当用户进行多轮迭代时,基于Spark内存计算的优势尤为明显.

  2. JDBC学习笔记(1)——JDBC概述

    JDBC JDBC API是一个Java API,可以访问任何类型表列数据,特别是存储在关系数据库中的数据.JDBC代表Java数据库连接. JDBC库中所包含的API任务通常与数据库使用: 连接到数 ...

  3. Javascript/Jquery——简单定时器的多种实现方法

    第一种方法: <script language="javascript"> //使用setInterval间歇调用 (不建议使用该方法) $(function(){ s ...

  4. substr函数

    substr(字符串,截取开始位置,截取长度) //返回截取的字 substr('Hello World',0,1) //返回结果为 'H'  *从字符串第一个字符开始截取长度为1的字符串 subst ...

  5. SGU 171 Sarov zones (贪心)

    题目   SGU 171 相当好的贪心的题目!!!!! 题目意思就是说有K个赛区招收参赛队员,每个地区招收N[i]个,然后每个地区都有一个Q值,而N[i]的和就是N,表示总有N个参赛队员,每个队员都有 ...

  6. typdef struct 语法

    1:结构体 C语言中定义一个结构体的语法如下: struct tagMyStruct { int age; int sex; }; 其中,tagMyStruct是结构体名,在使用时,需要和struct ...

  7. 红帽 Enterprise Linux OpenStack Platform 4.0全面上市

    十一月,红帽公司推出Red Hat Enterprise Linux OpenStack Platform 4.0测试版,这款企业级解决方案集Red Hat Enterprise Linux的稳定性与 ...

  8. GitHub-撤销commit

    以下方法适用于:撤销最后一次提交的情况 步骤如下: 步骤1.使用 ”git log“ 命令 找到 想要撤销的操作之前的一次提交的commit id : 比如:使用 git log命令如下结果 comm ...

  9. .NET下的延迟加载

    在应用中有很多实例可能需要延迟创建对象, 比如设计模式中的单例模式就是一种非常常见的情况.如果不考虑线程安全我们通常会编写如下代码: public class SingleInstance { pri ...

  10. cocos2d-x CCTableView

    转自:http://www.cnblogs.com/dcxing/archive/2013/01/16/2862068.html CCTableView在游戏中一般用在背包这样场景或层中,当然也不止这 ...