Mini jquery file upload form in asp net

In this tutorial we will learn about how to use Mini AJAX File Upload Form in asp .net to upload multiple files with progress bars. Mini AJAX File Upload Form provides users a choice to drag/drop files or they can browse files to the uploader. Mini AJAX File Upload Form in asp .net also displays cool progress bars during file upload.

1. Download Mini AJAX File Upload Form

To get started with the Mini AJAX file upload form in asp .net you need to download the required files. You can download required files from here. After downloading the files copy assets folder and place it into your website.

2. Add refrence to CSS and Jquery Files.

Add these refrences just above the closing body tag.

    
    
    

    
    
    
    

    
    

    
    

    
    
    

3. Design File upload control.

Make sure you do not change id of the from tag.

    <form id="upload" method="post" action="Default.aspx" enctype="multipart/form-data">
        
Drop Here Browse
</form>

4. Increase max file upload size in web.config file.

    
    
    
    

5. Add required namespaces.

Add following namespace.

       using System.IO;
    

6. Code behind to upload files to folder.

Add following code in your .cs page.

       protected void Page_Load(object sender, EventArgs e)
    {
        foreach (string s in Request.Files)
        {
            HttpPostedFile file = Request.Files[s];
            int fileSizeInBytes = file.ContentLength;
            string fileName = file.FileName;
            string fileExtension = "";

            if (!string.IsNullOrEmpty(fileName))
                fileExtension = Path.GetExtension(fileName);

            
            string savedFileName = Guid.NewGuid().ToString() + fileExtension;
            string filename = Server.MapPath("~/") + savedFileName;

            // Place your code here to save information in database.

            // Save the stream to disk
            file.SaveAs(filename);
        }
    }

    public string path { get; set; }
    

Special thanks to Martin Angelov for such a cool script.

7. Demo Mini AJAX File Upload Form in asp .net

mini jquery file upload form in asp net

About Us | Terms of Use | Privacy Policy | Disclaimer | Contact Us Copyright © 2012-2024 CodingFusion
50+ C# Programs for beginners to practice