ASP.NET File Upload Example

ASP.NET File Upload Example

Jose M. Esteban
March 28, 2001

Level: Beginner/Intermediate

Download Source Code

ASP.NET provides an easy mechanism to upload files from a Web Browser to a Web Server. The class HtmlInputFile allows to handle programmatically the information submitted by the INPUT control of the type file, e.g., . Remember that the Input control of type file is only available in Web Browsers that support HMTL 3.2 and later versions. This HTML version is supported by IE 3.02 and Netscape 3.0 and their later versions.

There are two objects that you will use to upload files. One is the INPUT control in the Web Browser and the other is the HtmlInputFile object in the server. The INPUT control will be embedded inside a form that will post the information encoded in a format suitable for a file transfer over the Internet. The INPUT control will also load the selected  file into the Web Browser's memory,  and will allow access to the HtmlInputFile object in the code that runs in the server through the INPUT control's ID. I.e., you use the ID of the INPUT control as the reference to the HtmlInputFile object in the code that runs at the server.

To upload a file, the form must post the data with the code format multiform/form-data instead of the default application/x-www-form-urlencoded that sends the form elements in a name/value pair base. This restriction arises from the types of formats that an object of the class HtmlInputFile is capable of processing and the characters that can traverse the Internet without confusing the network devices and software. The following example shows how to set the encoding format of a form:

Once the data is submitted to the server, the object of the class HtmlInputFile exposes the property PostedFile, with an object of the type HttpPostedFile, that contains the raw file stream and the attributes of the file, such as, file length, file type, file name. But most important, the PostedFile object has the SaveAs method that allows to save the uploaded file to a local directory in the web server. You can also limit the type of the files you will allow users to upload by setting the Access property of the HtmlInputFile object, and you can also discard files base on the length by using the PostedFile.ContentLength property. The following example shows how to restrict the upload of video files. The ID loFile is the ID of the INPUT control.

loFile.Acess = "video/*" 

The example that follows shows how to enable a web form for file uploads and how to answer back to the user with a message and information about the file that was just uploaded. The web form is contained in a panel (FileUploadForm) that is initially visible and the answer is presented in a panel (AnswerMsg) that is initially disable. Once the file is uploaded, the web form panel is set to invisible and the message panel is set to visible.

The event that handles the submitted form runs at the server as indicated by the Submit INPUT tag:

The Directory and File classes allow to create a folder to contain the uploaded files and to get the name of the uploaded file filtering the path. In order to use this classes we need to include the System.IO name space, we can do so by including the import directive. This entry allows the upload the name space into the web form application, for more information on this topic read the article How to Manipulate Files in ASP.NET:

<%@ Import Namespace="System.IO" %>

For those of you that were familiar with uploading files in ASP, the HtmlInputFile class free us from the need of third party components to process the multipart data stream.

 

Demo this code

<%@ Import Namespace="System.IO" %>  <script LANGUAGE="VB" RUNAT="SERVER" ID=SCRIPT1>    Sub UploadFile_Clicked(Sender as Object, e as EventArgs)	Dim lstrFileName as string	Dim lstrFileNamePath as string	Dim lstrFileFolder as string	lstrFileFolder = "C:/TempUploadedFiles/"		'Gets the file name	lstrFileName = loFile.PostedFile.FileName	lstrFileName = File.GetFileNameFromPath(lstrFileName)		'Creates the folder if it does not exists	If (not Directory.DirectoryExists(lstrFileFolder)) Then		Directory.CreateDirectories(lstrFileFolder)	End If		'Save Uploaded file to server	lstrFileNamePath = lstrFileFolder & lstrFileName	loFile.PostedFile.SaveAs(lstrFileNamePath)		'Sets the answer	FileName.Text = lstrFileName	FileType.Text = loFile.PostedFile.ContentType	FileLength.Text = cStr(loFile.PostedFile.ContentLength)	FileUploadForm.visible = false	AnswerMsg.visible = true    End sub  </script>  
  
       
   
   
	
    
    
ASP.NET File Upload Example
	Select the File to Upload to the Server:
    
    
	
    
    
    
    
	
    
         
   
   
  
  
    
  
  
   
   	Thanks your file 
   
            has been uploaded
   
   
	We received 
   
            bytes of the type 
   
      
  
  	

 

 

 

<script language=javascript>function submitFeedback(){ window.open("", "feedbackwindow", "scrolling=no,center=yes,width=200,height=150,menubar=no,resizeable=no"); document.frmFeedback.submit(); return false;}</script>