jQuery Ajax Submit form elements with multipart/form-data (Image/Video)

Question

I am trying to submit a form via ajax using:

$(document).ready(function(){
$("#ajax-form").submit(function(){
    $.post(
        "albums.php",
        $("#ajax-form").serialize(),
        function(){

        }
    );
    return false;
});

});

I am posting data to the facebook graph api. I need to send the form text fields and image data to the remote facebook api server. Is this possible? Thanks!

score 5 · Accepted Answer · answered Aug 09 '11 at 00:45

This is a simple jQuery plugin to implement and works for me for running file uploads seemingly via AJAX. It is meant to run on forms of all kinds, but it does support file uploads. Though it uses iFrames, it runs everything silently without notice, and it works flawlessly every time for me:

http://jquery.malsup.com/form/

score 2 · Answer 2 · edited May 23 '17 at 12:04

2

Is this possible? Thanks!

No, doesn't look like it:

How can I upload files asynchronously?

edited May 23 '17 at 12:04

Community

1
1

answered Aug 08 '11 at 23:30

jk.

14,365
4
43
58

Save for the HTML5 File API, the only way really is to use an iframe with a form and submit your file using that iframe's form in the background. It is not the most straightforward way because you have to constantly check if the form has already submitted or if it has failed and handle accordingly. Cue in the libraries featured in jen's comment which already does that for you. – Hyangelo Aug 09 '11 at 00:15

jQuery Ajax Submit form elements with multipart/form-data (Image/Video)

2 Answers2

Linked