title: jQuery failed: parsererror with error thrown: SyntaxError: Unexpected end of JSON input
body: <p>I have a contact form which is passed to a PHP script through ajax. Once the form is processed, The ajax will perform some actions depending on the response received from json_encode() function in the PHP script. The problem is I get the following error message:</p>
  
  <blockquote>
    <p>parsererror  SyntaxError: Unexpected end of JSON input</p>
    
    <p>readyState:4 responseText:"" status:200 statusText:"OK"</p>
  </blockquote>
  
  <p>When the <code>dataType</code> is text in the ajax call and the PHP script simply echos a text message, then code works fine, but with json, I get the above error.</p>
  
  <p>I have tried header(<code>"Content-Type: application/json"</code>)and <code>JSON.parse()</code> with no success. I have added <code>charset="UTF-8"</code> in the header and tried <code>encode_utf8()</code> function on the array passed to <code>json_encode</code> too, but nothing seems to work for me.</p>
  
  <p>I am posting the code for the relevant files below. Any help to resolve this problem will be highly appreciated.</p>
  
  <p>contact.php</p>
  
  <pre><code>&lt;form action="" method="post" name="contactForm" id="contactForm"&gt;   
  
      &lt;div class="form-row"&gt;         
          &lt;div id="contactFormResponse"&gt;&lt;/div&gt;
  
          &lt;div class="form-col"&gt;  
              &lt;label for="orderNumer"&gt;Order Number&lt;/label&gt;
              &lt;input type="text" name="orderNumber" id="orderNumber" value="&lt;?php echo ($_POST['orderNumber']); ?&gt;" /&gt;
          &lt;/div&gt;
  
          &lt;div class="form-col"&gt;
            &lt;label for="comment"&gt;Comment *&lt;/label&gt;
            &lt;textarea name="message" id="comment" maxlength="2000" rows="5"&gt;&lt;?php echo ($_POST['comment']); ?&gt;&lt;/textarea&gt;
          &lt;/div&gt;
  
          &lt;div class="form-col"&gt;
              &lt;label for="title"&gt;Title *&lt;/label&gt;
              &lt;select name="title" id="title"&gt;
                  &lt;option value="" &lt;?php if ($_POST['title'] == "") {echo "selected='selected'";} ?&gt;&gt;Select a title...&lt;/option&gt;
                  &lt;option value="ms" &lt;?php if ($_POST['title'] =="ms") {echo "selected='selected'";} ?&gt;&gt;Ms&lt;/option&gt;
                  &lt;option value="miss" &lt;?php if ($_POST['title'] == "miss") {echo "selected='selected'";} ?&gt;&gt;Miss&lt;/option&gt;
                  &lt;option value="mrs" &lt;?php if ($_POST['title'] == "mrs") {echo "selected='selected'";} ?&gt;&gt;Mrs&lt;/option&gt;
                  &lt;option value="mr" &lt;?php if ($_POST['title'] == "mr") {echo "selected='selected'";} ?&gt;&gt;Mr&lt;/option&gt;
                  &lt;option value="other" &lt;?php if ($_POST['title'] == "other") {echo "selected='selected'";} ?&gt;&gt;Other&lt;/option&gt;
              &lt;/select&gt;
          &lt;/div&gt;
  
          &lt;div class="form-col"&gt;
              &lt;label for="firstName"&gt;First Name *&lt;/label&gt;
              &lt;input type="text" name="firstName" id="firstName" value="&lt;?php echo ($_POST['firstName']); ?&gt;" /&gt;
          &lt;/div&gt;
  
          &lt;div class="form-col"&gt;
              &lt;label for="surname"&gt;Surname *&lt;/label&gt;
              &lt;input type="text" name="surname" id="surname" value="&lt;?php echo ($_POST['surname']); ?&gt;" /&gt;
          &lt;/div&gt;
  
          &lt;div class="form-col"&gt;
              &lt;label for="email"&gt;Email Address *&lt;/label&gt;
              &lt;input type="text" name="email" id="email" value="&lt;?php echo ($_POST['email']); ?&gt;" /&gt;
          &lt;/div&gt;
  
          &lt;div class="form-col"&gt;
              &lt;input type="submit" name="submitContactForm" id="submitContactForm" value="Submit" class="btn" /&gt;
          &lt;/div&gt;
  
      &lt;/div&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>jsCode.js</p>
  
  <pre><code>// process contact form
  $("#contactForm").submit(function(e) {
  
      e.preventDefault();
  
      // some jQuery validation goes here...
  
      $.ajax({
          type:"POST",
          url: "functions.php",
          dataType: "json",
          data: new FormData(this),
          //data: $('form').serialize(),
          processData: false,
          contentType: false,
          success:function(response) {
              if(response.status === "OK") {
                  $("#contactFormResponse").html("&lt;div class='alert alert-success' id='message'&gt;&lt;/div&gt;");
                  $("#message").html(response.message).fadeIn("100");
                  $("#contactForm")[0].reset();
                  $(window).scrollTop(0); 
              } else if (response.status === "error") {
                  $("#contactFormResponse").html("&lt;div class='alert alert-danger' id='message'&gt;&lt;/div&gt;");
                  $("#message").html(response.message).fadeIn("100");
                  $(window).scrollTop(0);
              }  
         },
         error:function(jqXHR, textStatus, errorThrown) {
             console.log("JQuery failed: " + textStatus + " with error thrown: " + errorThrown);
             console.log(jqXHR);
  
           }
      });
  });
  </code></pre>
  
  <p>functions.php</p>
  
  <pre><code>// send email
  function sendMessage() {
  
      if (isset($_POST["submitContactForm"])) {
          if (!$_POST["comment"]) {
              $error .= "&lt;br /&gt;Comment is required.";
          }
  
          if (!$_POST["firstName"]) {
              $error .= "&lt;br /&gt;First name is required.";
          }
  
          // validation for other form fields goes here... 
  
          if ($error) {
              echo json_encode(array("status" =&gt; "error", "message" =&gt; "There were error(s)in your form: " . $error));
  
          } else {
  
              $to            = "email@domain.com";
              $subject       = "Message from the website";
              $order_number  = $_POST["orderNumber"];
              $comment       = $_POST["comment"];
              $title         = $_POST["title"];
              $first_name    = $_POST["firstName"];
              $surname       = $_POST["surname"];
              $email_address = filter_var($_POST["email"], FILTER_SANITIZE_EMAIL);
              $headers       = "From: " . $title  . " "  . $first_name . " " . $surname . " &lt;" . $email_address . " &gt;";
              $message       = "Order Number: " . $order_number . "/r/n" . "Topic: " . $topic . "/r/n" . "Comment: " . $comment;
  
              $result = mail($to, $subject, $message, $headers); 
  
              if (!$result) {
  
                  echo json_encode(array("status" =&gt; "error", "message" =&gt; "Message failed."));
  
              } else {
  
                 echo json_encode(array("status" =&gt; "OK", "message" =&gt; "Message sent."));
  
              }  
          }
      }
  }
  </code></pre>