0

I have quite an easy question but I just simply can't find out why my post isn't working. I have made a lot in the past and that's why I don't get where the error lies. Please help me, here is my AJAX code: 

$(function() {
  $("#btnSubmit").click(function(event) {
    event.preventDefault();
    var formData = $("formCI").serialize();   
    $.ajax({
      type     : "POST",
      url      : "formularioServer.php", 
      data     : formData,
      datatype : "json",
      async    : false
    })
    .done(function(data) {
      if(data != "success"){
        console.log(data);
      } else {
        alert("A ticket has been sent with your incident information to the CI-Hotline inbox");
        window.location = "formulario.php";
        console.log(data);
      }
    }); 
  });
});

Parts of my HTML:
<form name="formCI" id="formCI" action="formularioServer.php" method="POST" enctype="multipart/form-data" accept-charset="utf-8"> 

<button type="submit" name="btSubmit" id="btnSubmit" class="btn btn-default">


In the server side the POST always comes with the wrong message: 

<?php
if(!empty($_POST)) {
    echo "success";
} else {
    echo "failed";
}
?>
userX_2395
  • 3
  • 1
  • At a quick glance it seems like your problem could be in the .serialize() and the fact that you set the datatype to json, AFAIK .serialize() ist not the same as JSON.strigify(). .serialize() creates a URL encoded string, correct me if I'm wrong. I would start there. – Antoniu Livadariu Nov 08 '17 at 15:49
  • Could you expand on `parts of your html`? Any input fields in it? If it ONLY has the submit button, that element will not go through with POST because you are firing ajax on a click event (not submitting the form). – IncredibleHat Nov 08 '17 at 15:49
  • @AntoniuLivadariu the `datatype` refers to what ajax expects back. Not what it is sending. – IncredibleHat Nov 08 '17 at 15:50
  • Hello, my HTML has an standard form with several fields but I can't show it. – userX_2395 Nov 08 '17 at 15:50
  • 2
    @Randall haha sorry my brain died for a second, I confused it with contentType, I still think the problem is with .serialize() though :c Also, shouldn't it be `dataType`? – Antoniu Livadariu Nov 08 '17 at 15:51
  • @AntoniuLivadariu Maybe... depends on the form and if any fields were actually filled in (it excludes empty fields and the clicked button). JSHint says the js is fine though... so its gotta be a form issue. – IncredibleHat Nov 08 '17 at 15:53
  • Oh wait... the ajax is expecting back json, but the server is just spitting out a plain string (not json_encoded). Change `datatype: 'json'` to `datatype: 'text'` to test with? – IncredibleHat Nov 08 '17 at 15:57
  • And then I saw the multi-part content type of the form ... and if you are ACTUALLY sending files, you are going to need to handle that correctly in the ajax call. Could be possible duplicate of: https://stackoverflow.com/questions/5392344/sending-multipart-formdata-with-jquery-ajax – IncredibleHat Nov 08 '17 at 16:02

1 Answers1

2
var formData = $("formCI").serialize();

This should be

var formData = $("#formCI").serialize();

to get the correct form by its ID.

Also, serialize doesn't convert the data to json, it just encodes the data as a string for submission, so you have to remove the datatype : "json" line from the AJAX call.

José A. Zapata
  • 1,187
  • 1
  • 6
  • 12
  • 1
    Good catch on the missing `#` lol... how did we all miss that. Again, `datatype: "json"` is for what ajax expects BACK. Not what its sending. – IncredibleHat Nov 08 '17 at 16:01
  • Haha we already clarified that `dataType` sets what Javascript expects in return from the server, `contentType` is used to to tell what data type the server should expect – Antoniu Livadariu Nov 08 '17 at 16:01
  • Thank you very much! José A. Zapata, this fixed the issue. What I was trying to accomplish was to send an email with phpMailer but it was always returning an empty response but now it works perfectly. Thanks again. – userX_2395 Nov 08 '17 at 16:08
  • Derp. Yeah, I mixed `dataType` and `contentType`. My bad. – José A. Zapata Nov 08 '17 at 16:19