Scribd Logo
Cargar

¡Te damos la bienvenida a Scribd!

  • Multiple File Upload

    Cargado por

    tina001in
    21 vistas5 páginas
    Multiple File Upload

    Derechos de autor

    © Attribution Non-Commercial (BY-NC)

    Formatos disponibles

    DOC, PDF, TXT o lea en línea desde Scribd

    ¿Le pareció útil este documento?

    ¿Este contenido es inapropiado?

    Denunciar este documento
    Multiple File Upload

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Descargue como DOC, PDF, TXT o lea en línea desde Scribd
    Marcar por contenido inapropiado
    21 vistas5 páginas

    Multiple File Upload

    Cargado por

    tina001in
    Multiple File Upload

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Descargue como DOC, PDF, TXT o lea en línea desde Scribd
    Marcar por contenido inapropiado
    de 5

    In this article, Haissam Abdul Malak will explain how to upload multiple files using several file upload

    controls. This article will demonstrates how to create a webform with three HtmlInputFile controls which will allow the user to upload three files at a time. Introduction When Microsoft introduced ASP.NET version 1.0, they added the ability for web applications to upload files from client machines onto the web server. This can be done using the HTML input file server control. This control allows the user to browse for the file to upload. Now we will add three HTML input file server controls and allow the user to select three files. Upon pressing the Batch Upload button the selected files will be uploaded to the server. From there we will be filtering the uploaded files into two categories: Images Others We will create two folders inside the root application folder, the first is called "Images" which will be used to save only the images (jpg, gif) being selected by the user and the second is called "Others" which will be used to save all other types of files. HTML Code Let's first see how the HTML code of the webform will look like with the three html input file server controls and the three corresponding labels: <%@ Page language="c#" Codebehind="WebForm1.aspx.cs" AutoEventWireup="false" Inherits="MultipleUpload.WebForm1" %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" > <HTML> <HEAD> <title>WebForm1</title> <meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1"> <meta name="CODE_LANGUAGE" Content="C#"> <meta name="vs_defaultClientScript" content="JavaScript"> <meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5"> </HEAD> <body MS_POSITIONING="GridLayout"> <form id="Form1" method="post" runat="server"> <asp:Button id="Button1" style="Z-INDEX: 101; LEFT: 280px; POSITION: absolute; TOP: 101px" runat="server" Text="Batch Upload" />

    <div id="Div1" runat="server" style="ZINDEX:102;LEFT:165px;WIDTH:1026px; POSITION:absolute;TOP:7px;HEIGHT:19px"> <INPUT id="FileUpload1" style="WIDTH: 389px; HEIGHT: 22px" type="file" size="45" runat="server"> <asp:Label id="Label1" runat="server" Width="598px" ForeColor="Red" /> </div> <div id="Div2" runat="server" style="ZINDEX:103;LEFT:166px;WIDTH:1026px; POSITION:absolute;TOP:38px;HEIGHT:19px"> <INPUT style="WIDTH: 389px; HEIGHT: 22px" type="file" size="45" runat="server" id="FileUpload2"> <asp:Label id="Label2" runat="server" Width="357px" ForeColor="Red" /> </div> <div id="Div3" runat="server" style="ZINDEX:104;LEFT:166px;WIDTH:1026px; POSITION:absolute;TOP:68px;HEIGHT:19px"> <INPUT style="WIDTH: 389px; HEIGHT: 22px" type="file" size="45" runat="server" id="FileUpload3"> <asp:Label id="Label3" runat="server" Width="361px" ForeColor="Red" /> </div> </form> </body> </HTML> The screenshot below demonstrates how the webform will look after we have added the specified controls.

    Code Behind To upload the files to the server we will use the following four system classes. HttpFileCollection HttpPostedFile Request.Files System.IO.Path The HttpFileCollection class contains a collection of HttpPostedFile. To get the files selected by the user, we will use the Request.Files, which will return a collection of files, and store them inside the

    HttpFileCollection. The System.IO.Path is used to check the file extension and the filename. We will use the file extension to filter between images and other files types. HttpFileCollection uploadFilCol = Request.Files; for(int i=0;i<uploadFilCol.Count;i++) { HttpPostedFile file = uploadFilCol[i]; string fileExt = Path.GetExtension(file.FileName).ToLower(); string fileName = Path.GetFileName(file.FileName); if(fileName != string.Empty) { try { if(fileExt == ".jpg" || fileExt == ".gif") { file.SaveAs(Server.MapPath("./Images/") + fileName); } else { file.SaveAs(Server.MapPath("./Others/") + fileName); } } catch(Exception ex) { throw ex; } } } As you may have noticed we are looping through each HttpPostedFile in HttpFileCollection, saving the file extension in a variable and the file name in a second variable. Then we are checking for the extension. If it's an image we are using the HttpPostFile.SaveAs() method to save the image inside the "Images" directory and if it is another type of file we are saving it into the "Others" directory. Next well create a method called ShowMessages whichll display the status of each file upload: private void ShowMessage(string message, int fileUploadPos ) { if(fileUploadPos ==0) { Label1.Text = message; } else { if(fileUploadPos ==1) {

    Label2.Text = message; } else { Label3.Text = message; } } } ShowMessage takes two parameters, the first is a string parameter and the second is an integer related to the index of HttpFileCollection being processed. This method will be used to display a message beside each HTML input server control to tell the user if the upload succeeded or to display the error message if an error occurred. The below screenshot shows how the messages will be displayed after a successful upload process.

    Complete code: HttpFileCollection uploadFilCol = Request.Files; for(int i=0;i<uploadFilCol.Count;i++) { HttpPostedFile file = uploadFilCol[i]; string fileExt = Path.GetExtension(file.FileName).ToLower(); string fileName = Path.GetFileName(file.FileName); if(fileName != string.Empty) { try { if(fileExt == ".jpg" || fileExt == ".gif") { file.SaveAs(Server.MapPath("./Images/") + fileName); this.ShowMessage(" " + fileName + " Successfully Uploaded",i); } else { file.SaveAs(Server.MapPath("./Others/") + fileName); this.ShowMessage(" " + fileName + " Successfully Uploaded",i); } } catch(Exception ex) { this.ShowMessage(" " + ex.Message, i);

    } } } There are two things to take into consideration for this upload process to succeed: You have to modify the maxRequestLength attribute of <httpRuntime> inside the Web.config file in order to be able to upload more than 4 MB size. Remember its value is in KB. Give access to the ASPNET user account to the two folders we have created (Images, Others). Conclusion In this article, you saw how powerful the HTML file server control can be. Adding this capability into your web application will give the user the ability to upload multiple files to your web server. Downloads MultipleUpload Control Library

    También podría gustarte