Hakuna Matata Hakuna Matata - 2 years ago 512
jQuery Question

Using dropzone.js in asp.net

Since few days i m trying to implement multiple file upload with drag and drop interface.
I have searched a lot and at last found my exact requirement from

I tried same steps from above site.
but, I am unable to implement this dropzone functionality in my aspx page.

Answer Source

Assuming you are using Web Forms, you need to implement a page that reads the posted file data and saves it to file.

Example .ASPX

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="Mvc4Application_Basic.WebForm1" %>

    <!DOCTYPE html>

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <script src="https://raw.github.com/enyo/dropzone/master/downloads/dropzone.js"></script>
        <link href="http://www.dropzonejs.com/css/general.css?v=7" rel="stylesheet" />
        <form id="frmMain" runat="server" class="dropzone">
                <div class="fallback">
                    <input name="file" type="file" multiple />

Example code-behind

    public partial class WebForm1 : System.Web.UI.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 = Request.Headers["X-File-Name"];
                string fileExtension = "";

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

                // IMPORTANT! Make sure to validate uploaded file contents, size, etc. to prevent scripts being uploaded into your web app directory
                string savedFileName = Path.Combine(@"C:\Temp\", Guid.NewGuid().ToString() + fileExtension);

If you are using MVC, see this http://stackoverflow.com/a/15670033/2288997

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download