How to send a file to a server using JSON and jQuery How to send a file to a server using JSON and jQuery json json

How to send a file to a server using JSON and jQuery


jQuery is JavaScript. I think you mean to send the data via Ajax which can not be done. The best thing you can do is to use an iframe to a page that uploads the file to a temporary directory (not the default temp), and then provides the information back to the parent page as to where the file is saved then you use it.

There is no way to upload a file to a server using Ajax. It's too insecure.

I retract the Statement above NOW

You are now able to post/download file data using Javascript it's very complicated for a novice to understand but is now possible unlike when this question was answered

Using HTML5 file uploads with AJAX and jQuery


File uploads won't work through an AJAX request. It needs to be a full HTTP request (POST). Any jQuery plugins that are used typically use either a Flash- or Java-based applet or the hidden iframe trick where a real POST is done using an iframe hidden on the page.


I've tried it using $.ajaxFileUpload (http://www.phpletter.com/Demo/AjaxFileUpload-Demo/) and if you are using ASP.NET MVC you can retrieve the files as follows

  public ActionResult UploadFiles(List<HttpPostedFileBase> uFile)

Usage of $.ajaxFileUpload:

  $.ajaxFileUpload(    {        url: "/Controller/UploadFiles",         secureuri: false,        fileElementId: 'uFile', // the id of the file input controls holding the references to the files        dataType: 'json',        success: function (data, status) {            // needs to handle the json return        },        error: function (data, status, e) {            // same as error        }    })

For me it works very well.