Pass form data via Ajax into PhP - php

Question

I have a form using both text-fields and upload-fields.
<form action="submit" method="post" enctype="multipart/form-data">
<input type="text" name="textfield">
<input type="file" name="file_upload">
<button type="submit">Submit</button>
</form>
How can I pass all the inserted data via ajax and use the data in PhP?
What I currently trying via ajax is:
var fd = new FormData($('form'));
$.ajax({
url: ajaxurl,
type: 'POST',
processData: false,
contentType: false,
data: {
fd: fd,
action: 'devplus_submit_annex' // a php function
},
success: function(response) {
JSON.parse(response);
},
error: function(response) {
console.log('Error');
}
});

Answer 1

The FormData constructor takes an HTMLFormElement as its argument, you passed a jQuery object.
For jQuery.ajax you pass the form data object alone as the data field
If you need to add data outside of the from you can use the append() method.
var fd = new FormData($('form')[0]);
fd.append('action', 'devplus_submit_annex');
$.ajax({
url: ajaxurl,
type: 'POST',
processData: false,
contentType: false,
data: fd,
success: function(response) {
JSON.parse(response);
},
error: function(response) {
console.log('Error');
}
});