lets jump right into the code :
var formData = new FormData();
formData.append(\'name\', dogName);
formData.append(\'weight\', dogWeight);
formData.append(
When you're sending an ajax request via jQuery and you want to send FormData you don't need to use JSON.stringify
on this FormData. Also when you're sending file the content type must be multipart/form-data
including boundry
- something like this multipart/form-data; boundary=----WebKitFormBoundary0BPm0koKA
So to send FormData including some file via jQuery ajax you need to:
data
to the FormData without any modifications.processData
to false
(Lets you prevent jQuery from automatically transforming the data into a query string).contentType
to false
(This is needed because otherwise jQuery will set it incorrectly).Your request should look like this:
var formData = new FormData();
formData.append('name', dogName);
// ...
formData.append('file', document.getElementById("dogImg").files[0]);
$.ajax({
type: "POST",
url: "/foodoo/index.php?method=insertNewDog",
data: formData,
processData: false,
contentType: false,
success: function(response) {
console.log(response);
},
error: function(errResponse) {
console.log(errResponse);
}
});
//For those who use plain javascript
var form = document.getElementById('registration-form'); //id of form
var formdata = new FormData(form);
var xhr = new XMLHttpRequest();
xhr.open('POST','form.php',true);
// xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
//if you have included the setRequestHeader remove that line as you need the
// multipart/form-data as content type.
xhr.onload = function(){
console.log(xhr.responseText);
}
xhr.send(formdata);
if you did exactly as pervious anwswer and still not working
dont worry its working
maybe intelligence and quick wath
are telling you its not working
but dont worry, look at network tap
its working
hope this saves your time