Django Phonegap csrf settings

Question

I have a set up a Django server and want to access it by a Phonegap application using ajax. This works well so far. Now I try to upload a file to the server, but I am getting status code 403 FORBIDDEN.

I think this is because I use a form to upload the file and csrf does not work right.

The csrf token is pulled on login:

def login(request):
...
response = {
    ...
    'csrf' : get_new_csrf_key()
}
return HttpResponse(json.dumps(response), content_type='json')

and stored in public R.user.csrf

Server upload view:

from django.middleware.csrf import _get_new_csrf_key as get_new_csrf_key
from django.middleware.csrf import CsrfViewMiddleware

...

def uploadfile(request):
    ...
    if request.is_ajax():
        form = UploadForm(request.POST, request.FILES)
        u_file = request.FILES['upload']
        extension = u_file.name.split(".")[-1]

        upload = File(
            data = u_file,
            owner = user,
            fileid = newfid,
            name = 'newfile',
            description = u_file.name,
            createdat = timezone.now(),
            type = extension
        )
        upload.save()
        response = {
            'head' : 'Success',
            'message' : 'Filed uploaded!',
            'time' : '3000',
            'fileid' : newfid
        }

    return HttpResponse(json.dumps(response), content_type='json')

Application ajax call:

var uploadFile = function(){
    console.log('uploading file...');
    updateLoader(1);
    var selectFile = $('#selectfile');
    var file = new FormData($('#uploadForm')[0]);
    var request = $.ajax({
        type : "POST",
        url : R.urls.uploadfile,
        data : {
            'file' : file,
            csrfmiddlewaretoken : R.user.csrf
        },
        processData : false,
        contentType : false,
        error : function(response) {
            console.log('upload failed!');
            updateLoader(-1);
            showMessage("Failed", "Something went wrong...", 3000);
            selectFile.replaceWith(selectFile = selectFile.clone(true));
        },
        success : function(data) {
            console.log('upload successful!');
            updateLoader(-1);
            var filename = $('#filename').val();
            var parent = $('#parentfolder').val();
            sendReRequest(data.fileid, filename, parent);
            selectFile.replaceWith(selectFile = selectFile.clone(true));
        }
    });
};

HTML:

<input class="inputfield" type="text" id="parentfolder" name="parentfolder"><br/>
<input class="inputfield" type="text" id="filename" name="filename"  placeholder="Give your file a name"><br/>
<form id="uploadForm" method="post" enctype="multipart/form-data">
    <input class="inputfield" id="selectfile" type="file" name="upload"><br/>
    <input id="uploadfilebutton" type="submit" value="Upload" />
</form>

I also tried:

var csrfSafeMethod = function(method) {
    // these HTTP methods do not require CSRF protection
    return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
};

$.ajaxSetup({
    beforeSend: function(xhr, settings) {
        if (!csrfSafeMethod(settings.type) && !this.crossDomain) {
            xhr.setRequestHeader("X-CSRFToken", R.user.csrf);
        }
    }
});

What do I miss? Thanks!