title: jQuery $.ajax failing silently, no error messages, and server responded with 200 OK
body: <p>I am about to do my head in over this problem. I am using very simple jQuery ajax calls to get values from a database and populate a few select elements with the values, all returned as JSON. It works seamlessly for me on most browsers, however the client is reporting that neither them nor their clients are seeing the result.</p>
  
  <p>I added some Console.log() commands along the way to make sure the code was executing, and it was. Sometimes the ajax GET to the URL in question works, other times is STILL returns 200 OK but the code simply does not execute further, and NO ajax error messages are shown in the error callback.</p>
  
  <p>Here is the code I am using, can someone spot something obvious that may result in some browsers choking? If so, I'd be grateful if you could point it out:</p>
  
  <pre><code>        var $j = jQuery.noConflict(true);
          $j(document).ready(function(){
              //console.log("jQuery has loaded");
              //console.log("attempting to load country list via AJAX call now");
              $j.ajax({
                  url: 'http://www.topplaces.co.za/templates/seb_one/positions/search_establishments_filter/search/db.php?q=countries&amp;rand='+Math.random(),
                  success: function(data){
                      //console.log("Successfully got country list, going to populate the dropdown now");
                      if(data.length){
                          $j("#country").children("option:not(:first)").remove();
                          $j("#country").attr("disabled", false);
                          $j.each(data, function(resultIndex, result){
                              var o = new Option();
                              $j(o).html(result.country).val(result.country);
                              $j("#country").append(o);
                          })
                          //console.log("Country list should be populated now?");
                      }
                  },
                  error: function (xhr, ajaxOptions, thrownError){
                      //console.log(xhr.responseText);
                      console.log(thrownError);   
                  },
                  dataType: 'json',
                  cache: false
              })
  
              $j("#country").live('change', function(){
                  var id = $j(this).val();
                  if(id == ""){
                      $j("#province").attr("disabled", "disabled");
                      $j("#town").attr("disabled", "disabled");
                      return false;
                  }
                  $j.ajax({
                      url: 'http://www.topplaces.co.za/templates/seb_one/positions/search_establishments_filter/search/db.php?q=provinces&amp;c='+id+'&amp;rand='+Math.random(),
                      success: function(data){
                      if(data.length){
                          $j("#province").children("option:not(:first)").remove();
                          $j("#province").attr("disabled", false);
                          $j.each(data, function(resultIndex, result){
                              var o = new Option();
                              $j(o).html(result.province).val(result.province);
                              $j("#province").append(o);
                          })
                      }
                  },
                  dataType: 'json',
                  cache: false
                  })
              });
  
              $j("#province").live('change', function(){
                  var id = $j(this).val();
                  if(id == ""){
                      $j("#town").attr("disabled", "disabled");
                      return false;
                  }
                  $j.ajax({
                      url: 'http://www.topplaces.co.za/templates/seb_one/positions/search_establishments_filter/search/db.php?q=towns&amp;p='+id+'&amp;rand='+Math.random(),
                      success: function(data){
                      if(data.length){
                          $j("#town").children("option:not(:first)").remove();
                          $j("#town").attr("disabled", false);
                          $j.each(data, function(resultIndex, result){
                              var o = new Option();
                              $j(o).html(result.town).val(result.town);
                              $j("#town").append(o);
                          })
                      }
                  },
                  dataType: 'json',
                  cache: false
                  })
              });
  
          })
  </code></pre>
  
  <p>I have commented out the Consol.log commands for the pure fact that the client was receiving error messages on IE as there is no console.</p>
  
  <p><strong>EDIT: I failed to mention that this a same domain request and therefore obeys the Same Origin Policy</strong></p>
  
  <p>The full site is here: <a href="http://www.topplaces.co.za/" rel="noreferrer">http://www.topplaces.co.za/</a>
  On the right is a dynamic select group that starts with country and initiates AJAX calls until a Province is selected. The issue, a lot of people say that Country is no loading for them...</p>
  
  <p>Kind regards,
  Simon</p>