jquery form plugin by malsup: csrf_token invalid
I'm using the form plugin by malsup (
http://malsup.com/jquery/form/) to upload files and present an upload status. However up on submitting a file, I receive
Forbidden (403)
CSRF verification failed. Request aborted.
The html of the form looks like that:
<form enctype="multipart/form-data" action="upload/" method="POST" id="upload_form">
<div style="display:none"><input type="hidden" name="csrfmiddlewaretoken" value="2o9sTsFlDASjxZkd7h6mOA18EWzqmIWo"></div>
<label for="id_file">File:</label> <input type="file" name="file" id="id_file"></p>
<input type="submit" value="Upload">
</form>
The init of the plugin looks like that:
$('#upload_form').ajaxForm({
beforeSend: function() {
status.empty();
var percentVal = '0%';
bar.width(percentVal)
percent.html(percentVal);
},
uploadProgress: function(event, position, total, percentComplete) {
var percentVal = percentComplete + '%';
bar.width(percentVal)
percent.html(percentVal);
},
complete: function(xhr) {
status.html(xhr.responseText);
}
});
I'm using django 1.4 on the server side, which should be capable to handle the XMLHttpRequests generated by the form plugin. The file upload succeeds without the plugin, so the value of the csrf_token is correct.
My question: What is the correct way of handling the csrf_token for file uploads using that plugin?