How to use jQuery file upload?

Question

I am trying to use the blueimp jQuery File Upload plugin, but without much success. I want my script to upload the file along with other form details when my user clicks the Save button. So far I have this:

$(document).ready(function() {
    $('#custom-file-upload').fileupload({
        dataType: 'json',
        autoUpload: false,
        url: get_current_url() + '/customFileUpload/',
        done: function (e, data) {
            //$.each(data.result, function (index, file) {
            //  $('<p/>').text(file.name).appendTo(document.body);
            //});
        },
         change: function (e, data) {
            $.each(data.files, function (index, file) {
                $("#custom-file-upload-filename").text( file.name );
            });
        },
        submit: function(e, data) {
            console.log('submit event fired');
            return false;
        }
    });

    $('.edit-form .btn-submit').click(function(ev) {
        ev.preventDefault();
    })
});

So when my user clicks the "Attach File" button, a nice file browser pops up, they pick a file and click Open, and it shows the filename next to the Attach File button.

I do not know how to get it to submit my form now though. I've tried a bunch of different things and after reading the docs I still have no idea.

@RajatSinghal I said in my post I read the docs. I can't get that example to work for me. — Brandon - Free Palestine
– Brandon - Free Palestine, Commented Mar 19, 2012 at 19:10
The write up for jquery-file-upload is pretty poor at best. The code examples aren't great either. I've having the same problem. — netwire
– netwire, Commented Oct 15, 2013 at 21:00

fragmentedreality · Accepted Answer · 2012-03-19 17:16:40Z

1

I didn't get this to work either and ended up using the forms-plugin. The usage is pretty straightforward and there are good examples on the page.

You just code a normal form in HTML and attach the jQuery like this:

$('#myForm1').ajaxForm(options);

answered Mar 19, 2012 at 17:16

fragmentedreality

1,31310 silver badges33 bronze badges

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

Collectives™ on Stack Overflow

How to use jQuery file upload?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related