Using the File Field Control to Upload one/many Files

This tutorial will show you how to use the File Field Control to allow end-users to upload one or many files to your server.

In this tutorial we will demonstrate the file field control that uses the HtmlInputFile class. This is a pretty cool control because it does things that were difficult to do in previous versions of ASP.NET. The File Field control uploads files to the server from the client's machine.

The File Field Control allows access to program the HTML <input type="file"> tag. This is used to work with file data within an HTML form. Here is an example of a form with a single File Field Upload Control:

<form runat="server" enctype="multipart/form-data">  Select a file to upload: <input type="file"  id="File1"  runat="Server"> <p> <input type="btnSubmit"  id="Submit1"  runat="Server"  value="Upload File"  OnServerClick="UploadButton_Click"> <p> <span id="Span1"  runat="Server" /> </form>

Notice the <form enctype= "multipart/form-data"> tag. The enctype attribute's purpose is to indicate how form data should be encoded before it's sent to the location defined in the action attribute. By default, form data is encoded so that spaces are converted to "+" symbols. Special characters for example, like apostrophes, percentage and other symbols, etc.. are converted to their ASCII HEX equivalents.

Need help with Windows Dedicated Hosting? Try Server Intellect I'm a happy customer!

In this case the possible values are "multipart/form-data", which is required when you're using forms that have a file upload control like we have. This ensures that no character conversion takes place, and transfers form data as a compound MIME document, and "text/plain", which converts spaces to "+" symbols, but doesn't HEX-encode special characters such as apostrophes.

And here is the script:

<script runat="server">  void UploadButton_Click(Object sender, EventArgs e)  {  if (File1.PostedFile != null)  {  try  {  File1.PostedFile.SaveAs("C:\\UploadedUserFiles");  Span1.InnerHtml = "Uploaded Successfully!";  }  catch (Exception ex)  { Span1.InnerHtml = "Error saving file C:\\" + File1.Value + "<br>" + ex.ToString();  }  }  } </script>

When the page is run, it is easy to select and upload files to the server by clicking the Upload File button. Also, be sure to use the correct path when writing your files to a server.

Now we are going to upload multiple files at the same time. We have gone over how to upload files to the server, now let's take a look at how to upload multiple files to a server from a single page. Unfortunately, there are no built-in capabilities in the .NET Framework that enables you to upload multiple files from a single page.

If you're looking for a really good web host, try Server Intellect - we found the setup procedure and control panel, very easy to adapt to and their IT team is awesome!

First, we need to import the System.IO class into your ASP.NET page, and use HttpFileCollection class to capture all the files that are sent within the Request object. By doing this you can upload as many files as want, simultaneously from a single page.

In this next code block we will build an ASP.NET page similar to the one we just created but now with three file-input boxes and a UploadSubmitButton. After the user clicks the UploadSubmitButton and the files are posted to the server, the code behind takes the files and saves them to a specific location on the server. Then after they are saved the info that was posted is now displayed on the same page.

<form id="myForm" enctype="multipart/form-data" runat="server">  <fieldset>  <legend> Select the first File :<br /> </legend>  <input id="File1"  type="file"  runat="Server" /> <br />  Select the second File :<br /> </legend>  <input id="File2"  type="file"  runat="Server" /> <br /> Select the third File :<br /> </legend>  <input id="File3"  type="file"  runat="Server" /> <br /> </fieldset>  <p>  <input id="btnSubmit"  type="submit"  value="Upload Files"  runat="Server"  onserverclick=" UploadSubmitButton _Click" /> <br /> </p> <span id="Span1"  runat="Server"> Subscribe to: Post Comments (Atom) Followers Blog Archive ▼  2011 (1309) ►  August (220) ▼  July (1089) Produce a SAX stream from a DOM Document Sax to DOM converter Create Xml Reader Utility class for xml/sax handling XML utility methods that only depend on the JDK Using XML locator to indicate current parser position Handling SAX errors during parsing Extracting attribute values from XML elements Configuring SAX parser factory to produce alternat... Accessing features of the SAX parser implementation Accessing character data (CDATA) of XML element Simple lister - extract name and children tags A Content Handler to Output a Sorted List A Content Handler to Output a Sorted List as HTML SAX Checker A Program to Display the Input from a SAX Parser Duplicates XML Files SAX Demo Parsing XML Files with SAX is SAXParserFactory NamespaceAware Create SAXParser from SAXParserFactory Return the first element child with the specified ... Resolve relative URIs and SystemID strings into ab... XML constants Create XML validator from XML schema Validate xml against the schema Validate xml against XML Schema Validate Stax Load XML document to a tree with XML stream reader Create a StAX Event Tree Viewer Inline Stream Filter Print XInclude Print DOM out SVG to JPEG SVG Canvas Demo SVG Graphics DDemo XML input, output and transform utilities Transforming an XML File with XSL into a DOM Document Formatting an XML file using Transformer Catch TransformerException Applying XSLT Stylesheets Create an XML file and attach an XSL Transformer with parameters Transforming DOM Node to HTML with JAXP Set the TransformerFactory system property to gene... Processing XML Documents Partially Use the transform.TransformerFactory plugability i... XSLT I18N A Program That Performs XML Transformations XML transformation Use DOM L3 DOMBuilder, DOMBuilderFilter DOMWriter ... Write Xml (Node n, OutputStream os) XMLWriter helper class write Xml DOM Node Write DOM out Convenience methods for writing XML XML Writer Writing a DOM Document to an XML File XML Document Writer Source Update to Handle Stylesheet Parameters Yii Web Service A simple example to show how to use the DOM API Parsing XML with SAX Outputting a DOM with XMLSerializer Adding an Attribute with DOM Adding an Element with DOM Walking a Document with DOM whether the given 32 bit character is a valid XML ... Utility class for working with xml data Source To InputSource Sniffed Xml Reader Common XML constants. JAXP 1.3 Datatype API Whether the given character is a valid XML space. Sniffed Xml InputStream to find out the declaratio... Replaces all XML character entities with the chara... Your won XML binding extends DefaultHandler to create a XML binding Streaming XML XML Databases DOM XML Databases and Tools 2: read from blob XML Databases and Tools 1: read from clob XML Databases and Tools 3 Parse Properties Files Using isEmpty from String class Creates a classification scheme and publishes it t... Display the postal addresses for the contacts of t... Search a registry for organizations that offer ser... It searches a registry for information about organ... JAXR Publish Postal Create an organization and publishes it to a regis... Create a concept and publishes it to a registry Create an organization and publishes it to a registry Obtain all the registry objects owned by the user ... Find and deletes the classification scheme that th... Searches a registry for information about organiza... JAXR Delete Concept Finds and deletes the organization that the JAXRPu... Native XML Data Management with XIS 7 Enter every DOM node into a Swing JTree tree. The ... About Me source code online View my complete profile Ethereal theme. Powered by Blogger.