C # combine HTML5 bulk upload files and picture previews

HTML5 new Features

<input id= "IMGSF" type= "file" name= "IMGSF" multiple/>

Add multiple attribute in input file to select multiple files. IE9 The following versions are incompatible

<form id= "Form1" method= "Post" action= "Upload_json.ashx" enctype= "Multipart/form-data" >
<div>
<input id= "IMGSF" type= "file" name= "IMGSF" multiple/>
<input type= "text" name= "Ceshi" value= "Panlitao" >
<input type= "Submit" value= "Submission"/>
</div>
</form>

Preview JS

<div id= "IMGRQ" >
</div>
<script type= "Text/javascript" >



$ ("#imgsf"). Change (function () {
var filedx = 0;
for (var i = 0, j = this.files.length; I < J; i++) {
$ ("#imgrq"). Append (" ");
}


});


</script>

C # code

public class Upload_json:ihttphandler
{
Private HttpContext context;


public void ProcessRequest (HttpContext context)
{
String Aspxurl = context. Request.Path.Substring (0, context. Request.Path.LastIndexOf ("/") + 1);


File Save directory path
String Savepath = "attached/";


File Save Directory URL
String Saveurl = Aspxurl + "attached/";


Define the file extensions that are allowed to be uploaded
Hashtable exttable = new Hashtable ();
Exttable.add ("image", "gif,jpg,jpeg,png,bmp");
Exttable.add ("Flash", "swf,flv");
Exttable.add ("Media", "SWF,FLV,MP3,WAV,WMA,WMV,MID,AVI,MPG,ASF,RM,RMVB");
Exttable.add ("File", "doc,docx,xls,xlsx,ppt,htm,html,txt,zip,rar,gz,bz2");


Maximum file size
int maxSize = 1000000;
This.context = context;
String newfilename = "";
for (int i = 0; I < context. request.files.count;i++)
{
Httppostedfile Imgfile = context. Request.files[i];







if (Imgfile = = null)
{
ShowError ("Please select File. ");
}


String Dirpath = context. Server.MapPath (Savepath);
if (! Directory.Exists (Dirpath))
{
ShowError ("The upload directory does not exist. ");
}


String DirName = context. request.querystring["dir"];
if (String.IsNullOrEmpty (dirName))
{
DirName = "image";
}
if (!exttable.containskey (dirName))
{
ShowError ("The directory name is incorrect. ");
}


String fileName = imgfile.filename;
String Fileext = path.getextension (fileName). ToLower ();


if (Imgfile.inputstream = = NULL | | imgFile.InputStream.Length > MaxSize)
{
ShowError ("Upload file size exceeds limit. ");
}




Change to file stream to determine file format
String expath = Mall_bll.Common.isfilltype (Stream:imgFile.InputStream). ToLower ();


if (Expath! = "jpg" && expath! = "gif" && expath! = "BMP" && expath! = "png")
{ShowError ("The upload file name extension is not allowed. \ n allows only "+ ((String) exttable[dirname]) +" format. "); }


if (String.IsNullOrEmpty (fileext) | | Array.indexof (((String) exttable[dirname]). Split (', '), fileext.substring (1). ToLower ()) = =-1)
//{
ShowError ("The upload file name extension is not allowed. \ n allows only "+ ((String) exttable[dirname]) +" format. ");
//}


Create a folder
Dirpath + = DirName + "/";
Saveurl + = DirName + "/";
if (! Directory.Exists (Dirpath))
{
Directory.CreateDirectory (Dirpath);
}
String ymd = DateTime.Now.ToString ("YyyyMMdd", datetimeformatinfo.invariantinfo);
Dirpath + = Ymd + "/";
Saveurl + = Ymd + "/";
if (! Directory.Exists (Dirpath))
{
Directory.CreateDirectory (Dirpath);
}


NewFileName = DateTime.Now.ToString ("Yyyymmddhhmmss_ffff", datetimeformatinfo.invariantinfo) + Fileext;
String FilePath = Dirpath + newfilename;


Imgfile.saveas (FilePath);
}
String FILEURL = Saveurl + newfilename;


Hashtable hash = new Hashtable ();
hash["error"] = 0;
hash["url"] = FILEURL;
Context. Response.AddHeader ("Content-type", "text/html; Charset=utf-8 ");
Context. Response.Write (Jsonmapper.tojson (hash));
Context. Response.End ();
}


private void ShowError (String message)
{
Hashtable hash = new Hashtable ();
hash["Error"] = 1;
hash["message"] = message;
Context. Response.AddHeader ("Content-type", "text/html; Charset=utf-8 ");
Context. Response.Write (Jsonmapper.tojson (hash));
Context. Response.End ();
}


public bool IsReusable
{
Get
{
return true;
}
}
}

C # combine HTML5 bulk upload files and picture previews