ajax isUpload (Jquery)

Question

Hi all,

I was some time ago busy with ExtJS and ajax. I've have some data in csv format that i return. With ExtJS you can use the option isUpload to popup a file "filename.csv" where you can click save / open etc. Now i'm moving all ExtJS to Jquery and i don't seem to find something which handles this in Jquery, there is no option isUpload in ajax with jquery i guess? Does someone knows how to fix this?

Thanks in advance

Additional Info:

def export(object):
    object = object.order_by('hostname', 'dev_reported_time')
    export = ['test;blub;again;more\n', ]
    for i in object:
        export.append('%s;%s;%s;%s\n' % (i.test, i.blub, i.again, i.more))
    response = HttpResponse(''.join(export), mimetype='text/csv')
    response['Content-Disposition'] = 'attachment; filename=report.csv'
    return response

This is the function that gets called by checking the checkbox. A csv formatted content gets created with the header. I had this working with ExtJS option isUpload, it forced the browser to download the csv file. Now i don't want to use ExtJS anymore, i prefere Jquery or something else. So how to get this csv downloadable? When i check the checkbox at this moment i see the content displaying like the csv format... so the function is working but it doesn't seem to force the browser to download the csv file instead of showing it inside the content.

Watch out, with content i mean, the result is showing inside a div

Answer 1

There's no such functionality out of the box built in the jQuery library allowing you to submit forms containing file fields through ajax. You could take a look at the jQuery form plugin. Here's an example:

<form id="uploadForm" action="/script" method="POST" enctype="multipart/form-data"> 
    File: <input type="file" name="file" /> 
    <input type="submit" value="Submit" /> 
</form>

<script type="text/javascript">
$(function() {
    $('#uploadForm').ajaxForm(function() {
        alert('form successfully submited');
    });
});
</script>

It will automatically recognize that there's a file field and generate a hidden iframe allowing the upload to work.

Answer 2

def export(object):
object = object.order_by('hostname', 'dev_reported_time')
export = ['test;blub;again;more\n', ]
for i in object:
export.append('%s;%s;%s;%s\n' % (i.test, i.blub, i.again, i.more))
response = HttpResponse(''.join(export), mimetype='text/csv')
response['Content-Disposition'] = 'attachment; filename=report.csv'
return response

=+> this is the function that gets called by checking the checkbox. A csv formatted content gets created with the header. I had this working with ExtJS option isUpload, it forced the browser to download the csv file. Now i don't want to use ExtJS anymore, i prefere Jquery or something else. So how to get this csv downloadable? When i check the checkbox at this moment i see the content displaying like the csv format... so the function is working but it doesn't seem to force the browser to download the csv file instead of showing it inside the content.

Watch out, with content i mean, the result is showing inside a div