1. Home
2. asp.net
3. Multiple FileUpload using AJAX FileUpload with progress example in ASP.NET/C#

Multiple FileUpload using AJAX FileUpload with progress example in ASP.NET/C#

Category > ASP.NET || Published on : Thursday, September 18, 2014 || Views: 12615 || Multiple FileUpload AJAX FileUpload with progress AJAX FileUpload Asp.net multiple file upload

---

In this tutorial, We are going to learn How use Multiple FileUpload using AJAX FileUpload with progress example in ASP.NET/C#

The AjaxFileUpload control is part of Microsoft ASP.NET Ajax and it is used to upload multiple files to the Web Server folder. One thing to rememeber While uploading files it will display the upload progress for every files. Also AjaxFileUpload control also supports a drag-and-drop interface.

Features of AJAX ASP.NET AjaxFileUpload:

1. Displaying File Upload Progress while uploading
2. Uploading Very Large Files (greater than 1 Gigabyte)
3. Client-Side File Chunking
4. Uploading Multiple Files at a Time

so lets starts the fun part, the real coding.

Step 1: Create a ASP.NET empty Web Application

Step 2: Create a webform “Default.aspx” and write the following codes.

Step 3. Add the below AjaxControlToolkit assembly reference on the top of the page

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>

Step 4: Add "ScriptManager","AjaxFileUpload" from the Toolbox, the codes will look like:-

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
"http://www.w3.org/1999/xhtml">
"server">
    


    "form1" runat="server">
    "ScriptManager1" runat="server">
    
    
"center">
        
"font-family: Calibri">
            

                Multiple FileUpload using AJAX FileUpload with progress example in ASP.NET/C#
            
        
        "AjaxFileUpload1" runat="server" AllowedFileTypes="jpg,jpeg,png,gif,pdf"
            MaximumNumberOfFiles="10" OnUploadComplete="File_Upload" Width="500px" />
    
    

Step 5: Add following namespace on Defualt.aspx Code Behind File at the top of the page

using AjaxControlToolkit;

Step 6: Make the following changes as below on Default.aspx Code Behind Page:-

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using AjaxControlToolkit;

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }
    protected void File_Upload(object sender, AjaxFileUploadEventArgs e)
    {
        string filename = e.FileName;
        string strDestPath = Server.MapPath("~/Documents/");
        AjaxFileUpload1.SaveAs(@strDestPath + filename);        
    }
}

Step 7: Run the application and now you will upload multiple files with progress shown on the page.

Note: for demo purpose you can download the complete running solution at the end of this article.

Conclusion:-
so In this tutorial, We are going to learn How use Multiple FileUpload using AJAX FileUpload with progress example in ASP.NET/C#. Happy Coding!!!!

 

Download Source Codes

---

You might also like