django view cannot get file using request.FILES from ajax form submit

Question

I tried to submit this form using ajax ,sothat a django view can extract the selected file from request.FILES and write to a directory on server

<form enctype="multipart/form-data" method="post" id="fileupoadform">{% csrf_token %}
<p>
<label>Select a file
<input type="file" name="fselect" id="fselect"> </input>
</label>
</p>
<input type="submit" value="upload">
</form>

the view is

def ajax_upload(request):
    print 'ajax_upload()'
    print 'request=',request
    to_return = {}
    store_message="failure"
    if (request.is_ajax()) and (request.method == 'POST'):
        print 'is ajax and post'
        print 'request.FILES=',request.FILES
        if request.FILES.has_key('fselect'):
            print "request has key='fselect'"
            file = request.FILES['fselect']
            with open(settings.UPLOADPATH'%s' % file.name, 'wb+') as dest:
                for chunk in file.chunks():
                    dest.write(chunk)
            store_message="success"
    to_return['store_message']= store_message
    print 'to_return=',to_return
    to_return['store_message']= store_message
    serialized = simplejson.dumps(to_return)
    print 'serialized=',serialized
    if store_message == "success":
        print 'suceessfully returning'
        return HttpResponse(serialized, mimetype="application/json")
    else:
        print 'failed!! returning'
        return HttpResponseServerError(serialized, mimetype="application/json")

I used jquery to make the ajax submit

$(document).ready(function(){
    $('#fileupoadform').submit(function(e){
        submitUploadForm(e);            
    });
});
function submitUploadForm(e){
    console.log('clicked submit');
    e.preventDefault(); 
    var file = $('#fselect').get(0).files[0];
    console.log('filename='+file.name)  
    var data = { name:file.name };
    var args = { type:"POST", url:"upload/", data:data, complete:doneAjaxUpload };  
    $.ajax(args);   
}

when I tried this ,I got this console output

ajax_store_uploaded_file()
request= <WSGIRequest
GET:<QueryDict: {}>,
POST:<QueryDict: {u'name': [u'myfile.srt']}>,
COOKIES:{'csrftoken': 'ca367878345fa9e59adf79hg047a1dvb'},
...
is ajax and post
request.FILES= <MultiValueDict: {}>
to_return= {'store_message': 'failure'}
serialized= {"store_message": "failure"}
failed!! returning
[01/Jun/2012 11:27:26] "POST /myapp/upload/ HTTP/1.1" 500 28

I sense that I am doing something wrong in the django view..Is it that I cannot get the uploaded file from request.FILES.In a non ajax version of django view ,I was able to get the file from request.FILES using request.FILES['fselect']

Can somebody help me resolve this?

Which js library do you use to help uploading?

okm
– okm

2012-06-01 09:29:34 +00:00
Commented Jun 1, 2012 at 9:29 — okm
– okm, Commented Jun 1, 2012 at 9:29
@okm ,only jquery and the above script

damon
– damon

2012-06-01 09:54:43 +00:00
Commented Jun 1, 2012 at 9:54 — damon
– damon, Commented Jun 1, 2012 at 9:54

Community · Accepted Answer · 2017-05-23 10:34:47Z

1

I don't think you can do ajax file uploads (easily).

Certainly, it doesn't look like you're actually passing a file to your post data, you're just passing the file name -

var data = { name:file.name };

Check out this question for plugins / info to help do this - How can I upload files asynchronously?

edited May 23, 2017 at 10:34

CommunityBot

11 silver badge

answered Jun 1, 2012 at 8:25

Aidan Ewen

13.4k11 gold badges69 silver badges92 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

damon Over a year ago

that data was passed just for testing purposes.A normal form submit has the file data in request.FILES ,why is it that when submit is done thru ajax ,it is missing?

Aidan Ewen Over a year ago

I think you need to show how "submit is done thru ajax". The fact that the file isn't in request.FILES, suggests it's the javascript that's broken, not the django. What is the code that actually submits the file?

damon Over a year ago

thanks @Aidan for the reply..finally I got this working by using formData and XMLHttpRequest.send..

Collectives™ on Stack Overflow

django view cannot get file using request.FILES from ajax form submit

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related