Ajaxfileupload upload with parameter file and JS verify file size

Source: Internet
Author: User

 This snippet is for spring boot+hibernate, build with Maven 
One:
Ajaxfileupload to implement a no-flush asynchronous commit file, build an iframe and create a form form Then submit the file that you want to upload. But the original code did not process data. So this piece of content needs to be added by ourselves. The following Red section is the three places to modify Ajaxfileupload.js: (contrast source modification) 1. createuploadform:function (ID, fileelementid,data); 2.if (data) {for (var i in data) {$ (' <input type= ' hidden "name=" ' + i + ' "value=" ' + data[i] + ' "/> '). AppendTo (form); }} 3. var form = Jquery.createuploadform (ID, s.fileelementid,s.data);
HTML section:
<form id= "Form1" runat= "Server" method= "POST" enctype= "multipart/ Form-data " > 
<div> 
<div class=" _box "> select picture </div> 
</div > 
<div class= "None" > 
<input type= "file" Name= "FileID" id= "FileID"/>&NBSP;
</div>
</form>
Two:

$.ajaxfileupload ({
                    URL: ' url ',                     type: ' Post ',                    data: {                        url:url                    },                    Secureuri:false,//general set to False                    Fileelementid: ' FileID ',//upload the file ID, Name property name                    dataType: ' json ',//return value type, generally set to JSON, Application/json  here to use uppercase  or will not get the returned data                    success:function (data, status) {                          alert (data);                    },                    error:function (data, status, E) {                         alert ( e);                    }                );
Save Directory as E:\saveIMG

@ResponseBody
@RequestMapping ("/addandupload")
Public String addandupload (@RequestParam (value= "uploadimg", Required=false) multipartfile file) {
String filename = File.getoriginalfilename ();
String filepath = "e:\\saveimg\\"; File Upload Save Directory
if (!file.isempty ()) {//Determine if there is a file upload
try {
byte[] bytes = File.getbytes ();
Bufferedoutputstream stream = new Bufferedoutputstream (new FileOutputStream (New File (filepath, filename));
Stream.Write (bytes);
Stream.Close ();
} catch (Exception e) {
E.printstacktrace ();
}

}

The page displays multiple server pictures:

One:

The IMG tag of the HTML page is used in the SRC

Back-end Http://127.0.0.1:8080/foodmain/findimg?name? method

@ResponseBody
@RequestMapping ("/findimg")
public void findimg (HttpServletResponse response,string name) throws ioexception{
File Filepic = new file ("e:\\saveimg\\" +name);
if (filepic.exists ()) {
FileInputStream is = new FileInputStream (filepic);
int i = is.available (); Get File size
byte data[] = new Byte[i];
Is.read (data); Read data
Is.close ();
Response.setcontenttype ("image/*"); Set the returned file type
OutputStream toclient = Response.getoutputstream (); Gets the object that outputs the binary data to the client
Toclient.write (data); Output data
Toclient.close ();
}
}

JS verification upload File size, reference: http://zhuchengzzcc.iteye.com/blog/1573360

Ajaxfileupload upload with parameter file and JS verify file size

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.