title: Sweet Alert with ajax - can't figure out the return message after post
body: <p><br>
  I want to use sweet alert JS to display alerts on ajax form submit. By doing some research, I have figured out how to post with ajax but can't make it up running properly with sweet alert to display alerts.<br><br></p>
  
  <blockquote>
    <p>index.html:</p>
  </blockquote>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  
  &lt;head&gt;
    &lt;link data-require="sweet-alert@*" data-semver="0.4.2" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/0.4.2/sweet-alert.min.css" /&gt;
    &lt;script data-require="jquery@*" data-semver="2.1.4" src="http://code.jquery.com/jquery-2.1.4.min.js"&gt;&lt;/script&gt;
    &lt;script data-require="sweet-alert@*" data-semver="0.4.2" src="//cdnjs.cloudflare.com/ajax/libs/sweetalert/0.4.2/sweet-alert.min.js"&gt;&lt;/script&gt;
    &lt;link rel="stylesheet" href="style.css" /&gt;
    &lt;script src="script.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
    &lt;form class="form-horizontal" name="addSaleForm" id="addSaleForm" method="POST"&gt;
      &lt;label&gt;First Name:&lt;/label&gt;&lt;br&gt;
      &lt;input type="text" name="fname" id="fname"&gt;&lt;br&gt;
      &lt;button type="submit" id="submit-btn" name="register"&gt;Submit&lt;/button&gt;
    &lt;/form&gt;
  
    &lt;!-- Display result/error msg from php file --&gt;
    &lt;div id="status"&gt;&lt;/div&gt;
  
  &lt;/body&gt;
  
  &lt;/html&gt;
  
  
  &lt;script&gt;
    $(document).ready(function(e) {
      $("#addSaleForm").on('submit', (function(e) {
        e.preventDefault();
  
        swal({
            title: "Are you sure?",
            text: "Do you want to submit it?",
            type: "warning",
            showCancelButton: true,
            confirmButtonColor: '#DD6B55',
            confirmButtonText: 'Yes!',
            cancelButtonText: "No!",
            closeOnConfirm: false,
            closeOnCancel: false
          },
          function(isConfirm) {
            if (isConfirm) {
              swal(
              function() {
                $.ajax({
                  url: "process.php",
                  type: "POST",
                  data: new FormData(this),
                  contentType: false,
                  cache: false,
                  processData: false,
                  success: function(data) {
                    if (data === 'Success') {
                      swal("Processed!!!", "Your form is processed successfully", "success");
                    }
                    else {
                      document.getElementById("status").className += " alert-danger";
                      $("#status").html(data);
                      swal("Error!!!", data, "error");
                    }
                  },
                  error: function() {}
                });
              });
            } else {
              swal("Cancelled", "Your form is cancelled.", "error");
            }
          });
  
  
  
      }));
    });
  &lt;/script&gt;
  </code></pre>
  
  <blockquote>
    <p>process.php</p>
  </blockquote>
  
  <pre><code>&lt;?php
  if (isset($_POST['fname'])) {
    echo "Success";
  }
  else{
    echo "Please enter your first name.";
  }
  ?&gt;
  </code></pre>
  
  <p>And here's a live version of the above code.<br>
  <a href="http://plnkr.co/edit/maZs1NjFlxzqoFpGLgoe?p=preview" rel="nofollow">http://plnkr.co/edit/maZs1NjFlxzqoFpGLgoe?p=preview</a></p>