Search code examples
javascriptjqueryjquery-file-upload

Show file URL after upload - jQuery-File-Upload


I tried a lot but dont have a lot of experience regarding JS. I hope you can help.

I try to use Query-File-Upload (https://github.com/blueimp/jQuery-File-Upload) and it is working. I just need a little customization.

I want that the file url of the uploaded image will be shown after upload. At the moment only a preview picture will be shown, which is linked to the file url.

I think I have found the specific code, but don't know how to change it.

on('fileuploaddone', function (e, data) {
    $.each(data.result.files, function (index, file) {
        if (file.url) {
            var link = $('<a>')
                .attr('target', '_blank')
                .prop('href', file.url);
            $(data.context.children()[index])
                .wrap(link);
        } else if (file.error) {
            var error = $('<span class="text-danger"/>').text(file.error);
            $(data.context.children()[index])
                .append('<br>')
                .append(error);
        }
    });
})

I think I need to modify the part after var link = $('').

I hope you can help me.

TIA


Solution

  • Replace $(data.context.children()[index]).wrap(link); with $("body").append(link);

    Or inject the link inside a result or status div to say for example something like $("#myDiv").append(link);