Learning Django by Example(6): AJAX File Upload

Oct 4, 2007 django python

In the last post, I just added the entities in the database, but did not bind the meta data with eBook files. This post will demonstrate how to upload the file in AJAX flavor:

The idea is inspired by this tutorial , using dojo.io.iframe, we could submit a form with file upload asynchronously. In client side, a hidden field meta is added to store the marshaled JSON string. dojo.io.iframe.send shares the same defer concept as dojo.xhrPost:

var meta = dojo.query("input[@name=meta]", form)[0];
meta.value = dojo.toJson(cache[i]);

// submit the form
dojo.io.iframe.send({
    url: form.action,
    method: "post",
    handleAs: "json",
    form: form,
}).addCallback(function(ret) { ... });

NOTE: the handleAs is json, so the argument ret is JavaScript object.

In server side, the JSON string needs to be wrapped by textarea, this is the hard requirement of dojo.iframe.send.

return HttpResponse("%s" % simplejson.dumps(retset) , mimetype='text/html');

Conceptually, add-by-search will issue INSERT operation to the database, the result may fall in the following categories:

Success
FileAlreadyExist: the eBook file exists, so the uploaded file is discarded
UnexpectedError: an 500 error happens in server side for unknown reason.

Check r34 for the implementation.