Uploading multiple files with Ajax not making POST

Question

I took an example of How can I upload files asynchronously? which is a great example BTW.

For some reason my POST is not making it to my php file. Even when I print_r($_POST) the array comes up blank. I am trying to pass 2 fields with this Script.

If I simple do an echo "test"; on my php file it will return that string.

I also tried var formData = new FormData($('form').serialize());

<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
    $(':button').click(function(){
        var formData = new FormData($('form')[0]);
        $.ajax({
            url: 'inserttest.php',  //Server script to process data
            type: 'POST',
            xhr: function() {  // Custom XMLHttpRequest
                var myXhr = $.ajaxSettings.xhr();
                if(myXhr.upload){ // Check if upload property exists
                    myXhr.upload.addEventListener('progress',progressHandlingFunction, false); // For handling the progress of the upload
                }
                return myXhr;
            },
            success: function(data) {
                alert(data);    
            },
            data: formData,
            cache: false,
            contentType: false,
            processData: false
        });
    });
});
function progressHandlingFunction(e){
    if(e.lengthComputable){
        $('progress').attr({value:e.loaded,max:e.total});
    }
}
</script>
</head>
<form enctype="multipart/form-data">
    <input type="text" name="words" id="words" />
    <input name="file" type="file" id="file" />
    <input type="button" value="Upload" />
</form>
<progress></progress>

Took it a step further and made it the long way with formData...still no luck

var words = $('#words').attr('value');
var file = $('#file').attr('value');
var formData = new FormData();
formData.append("words", words);
formData.append("file", file);

inserttest.php

Tried

<?php
echo print_r($_POST);
?>

and

<?php
echo print_r($_FILES);
?>

You will find your files via the [`$_FILES`](http://php.net/manual/en/reserved.variables.files.php) superglobal — Sébastien, Oct 13 '14 at 22:28
I just changed my php to `echo print_r($_FILES);` and it still comes back as a blank array — Cesar Bielich, Oct 13 '14 at 22:30
You might consider taking a look at your web server logs, perhaps your PHP or servers settings need to be fixed, many possibilities include timeout, memory limit, post size limit, cross domain security, the list goes on. — tremor, Oct 14 '14 at 02:51

score 0 · Answer 1 · answered Jan 08 '15 at 07:11

the Jquery version you're using is outdated and doesn't support this feature!
Change version 1.3.0:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script>
...to version 1.9.1:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
...and it works!! :D

Uploading multiple files with Ajax not making POST

1 Answers1