Django - no image where it should be. How can I save image sent through ajax?

Question

I getting no image path saved in database and no image saved in filesystem. Item istance is saved becaues image is not required. views.py

def add_item(request, item_id):
    if request.method == 'POST': 
        if request.is_ajax(): 
            form = ItemForm(request.POST, request.FILES)
            if form.is_valid():
                user = request.user
                title = form.cleaned_data['title']
                content = form.cleaned_data['content']
                image = form.cleaned_data['image']                    
                item = Item.objects.get(id=item_id)
                item.add_child(user=user, title=title, content=content, image=image)  # add_child() because of using django-treebeard             
                return HttpResponse('')                                
            else:    
                return HttpResponse('')    
        else:        
            return HttpResponse('')

jquery:

$('#form_for_item').live('submit', function(){
    var data = $("#form_for_item").serialize();
    var url = '/something/add_item/' + $('#form_for_item').attr('name') + '/';
    $.ajax({
        type: 'POST',
        url: url,
        data: data,
        success: function(){
            $('#my_form').children().remove();
        }
    });
    return false;  
});     

I try also form image give to my add_item(request, item_id) function add this lines:

from django.core.files.uploadedfile import SimpleUploadedFile
    image = SimpleUploadedFile(request.META['HTTP_X_FILE_NAME'],request.raw_post_data) 

but didn't help.
How can I save image sent through ajax?

Answer 1

I think one of the issues may be that a normal jQuery AJAX request doesn't send the form data with content-type multipart/form-data. Have a look at this question for more information on how to send form data via AJAX with jQuery.

This solution does not seem to be 100% cross-browser compatible. A workaround could be displaying the form in an iframe and then using jQuery to submit the form when it should be saved.