title: Evaluate success data from jQuery .ajax() and return true/false based on result
body: <p>Greetings stackoverflow community. I am a long time lurker, and first time poster. I've spent several hours doing research trying to overcome the below problem, obviously without success as I am posting here. It should be noted that I have only been coding with jQuery(or any JS for that matter) for a couple of months.</p>
  
  <p>My goal is this: Submit a simple form with .ajax(), and then either alert(Success!) and return true (reload the page) if the returned success data == 'Success', or populate a div with an error message and return false otherwise.</p>
  
  <p>I have tried many different approaches that I found during my research, but no matter what I've tried I can get an evaluation of the success: data to return true.</p>
  
  <p>Here is my latest attempt:</p>
  
  <pre><code>$(document).ready(function() {
  
      $('#error').hide();
  
      $("#submit_result").submit(function() { 
          var postString = $('#submit_result').formSerialize(); /* Function from jQuery.form.js */
          $.ajax({
              url: 'inc/submit_speedtest.inc.php', 
              type:'POST',
              data:postString,
              success: function(msg) {
                  $('#error').html(msg);
              },
              error:function() {
                  $('#error').html('Error validating CLid!');
              }
          });
          if ($('#error').html() == 'Success') {
              alert('Done');
              return true;
          }
          $('#error').show();
          return false;
      });
  });
  </code></pre>
  
  <p>Everything works great, except:</p>
  
  <pre><code>if ($('#error').html() == 'Success') {
  alert('Done');
  return true;
  }
  </code></pre>
  
  <p>This test never evaluates to true. I've tried it many different ways, including things like</p>
  
  <pre><code>if $("#error:contains('Success')") {
  </code></pre>
  
  <p>Contents of submit_speedtest.inc.php:</p>
  
  <pre><code>    &lt;?php
  
  session_start();
  
  include('lib.inc.php');
  restrict_unauthorized();
  
  if(!empty( $_POST['clid'])) {
      $clid = trim($_POST['clid']);
      $result = check_clid($clid);
      echo $result;
  }else{
      echo "No CLid!";
  }
  
  ?&gt;
  </code></pre>
  
  <p>The check_clid() function runs a simple MySQL query to make sure CLid exists. As stated, this seems to work fine</p>
  
  <p>I hope this all makes sense, and I very much appreciate any help the stackoverflow community can offer me.</p>
  
  <p><strong>Edit</strong></p>
  
  <p>Thank you both for your input. I was able to glean useful information from both your responses. You gave me a better understanding of how the callbacks worked.</p>
  
  <p>Here is the jQuery code I ended up with:</p>
  
  <pre><code>$(document).ready(function() {
  
      $('#status_msg').hide();
  
      $("#submit_result").submit(function(e){
          e.preventDefault();
          var postString = $('#submit_result').formSerialize(); 
          $.ajax({
              url: 'inc/submit_speedtest.inc.php', 
              type:'POST',
              data:postString,
              success:function(msg) {
                  $('#status_msg').html(msg);
                  $('#status_msg').show();
              },
              error:function() {
                  $('#status_msg').html('&lt;font color="red"&gt;Error validating CLid!&lt;/font&gt;');
                  $('#status_msg').show();
              }
          });
      });
  });
  </code></pre>
  
  <p>PHP does the rest of the work, and it all works fine.</p>
  
  <p>Thanks again.</p>