FormData cannot appended with File Object - php

Question

Hi i am trying to upload image using AJAX but when i try to append FormData with my file object it didn't work here is my code
var data = new FormData();
$.each(files, function(key, value){
console.log(value);
data.append(key, value);
console.log(data);
});
and in console i got this response
File { size=1626773, type="text/comma-separated-values", name="Prepaid_Rates_01.03.2014.csv", more...}
uploadrates.js (line 17)
FormData { append=append()}
here u can see that File is shown in console but not available in data after append
i also see this type of questions but not find any proper answer that works

Answer 1

I'm not sure if that would work at all. Traditionally, the way to upload files with ajax is to submit the form to a hidden iframe, then give a response along the lines of:
<script type="text/javascript">window.parent.myCallback('Response Received!');</script>
So you would create a multipart form, set the target attribute to your iframe's name, and have all the fields (including the file fields) as form fields in this form, with the iframe after, e.g.
<form method="post" action="/my-upload-url" target="hidden-iframe">
Form fields here...
</form>
<iframe name="hidden-iframe"></iframe>
Then when the iframe loads after processing your form, it will immediately execute the javascript you've outputted as a response, which will call the function myCallback in your main page, so you should create that function as well:
<script type="text/javascript">
function myCallback(message) {
alert(message);
}
</script>
Altogether, your page should therefore be:
<form method="post" action="/my-upload-url" target="hidden-iframe">
Form fields here...
</form>
<iframe name="hidden-iframe"></iframe>
<script type="text/javascript">
function myCallback(message) {
alert(message);
}
</script>

Answer 2

there was a problem of using older jquery version file and by replacing with the latest do the job.
here is the old jquery
<script src="jquery-1.4.4.js"></script>
and the new jquery file is as:
<script src="jquery-1.11.0.min.js"></script>
i have no idea of the changes in both files but when i try the latest version it allow me to upload the file and now i prove that the latest versions are better to use and try to use the latest version;