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 http://www.dropzonejs.com/
I tried same steps from above site. but, I am unable to implement this dropzone functionality in my aspx page.
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"> <title></title> <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" /> </head> <body> <form id="frmMain" runat="server" class="dropzone"> <div> <div class="fallback"> <input name="file" type="file" multiple /> </div> </div> </form> </body> </html>
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); file.SaveAs(savedFileName); } } }
If you are using MVC, see this https://stackoverflow.com/a/15670033/2288997
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With