AJAX form submission - no data returned

Question

the form:

<form action="" id="register" method="post"> <input type="text" placeholder="eg. John"> <input type="text" placeholder="eg. Appleseed"> <input type="text" placeholder="[e-mail]"> </form> 

JS:

 $('form#register').on('submit',function (e) { $.ajax({ url: 'submit.php', cache: false, type: 'POST', context: this, data : $(this).serialize(), success: function(json) { console.log("json: " + json); } }); e.preventDefault(); }); 

PHP:

 $formData = json_encode($_POST); echo print_r($formData,1); 

... after filling out the form and clicking submit, it submits the form without error, but the returned data (JSON) is empty:

json: []

What am I doing wrong?

Answer 1

This is because you are not using the name attribute in your fields

 serialize() 

Required name field in your form

Answer 2

one: -

$formData = json_encode($_POST); echo print_r($formData,1);

it should be: -

 $formData = json_encode($_POST); echo $formData; 

2. You do not have a name attribute in your form fields. indicate that otherwise serialize() will not work correctly.