Question

I am using a simple ajax loader to get content on wordpress.

$("#page_preview").load("ajaxloader/", function(response, status, xhr) {
      if (status == "error") {
        alert("Sorry but there was an error");
      }
      else
      {
          $('#page_preview').fadeIn(300);
      }
    });
return;

When I load a specific post that has a google map embedded, obviously something goes wrong BUT instead of going inside the if statement, the firebug shows that it goes beyond this code. Neither if or else hit.

Using the eclipse debugger I found that the page load successfully, but when it returns the data to the .load() method, the last breaks.

Any ideas on what might going on?

Answer 1

How

<script>
    // as of jQuery 1.5.x ++
    var pagePreview = $("#page_preview");
    $.get("ajaxloader/").success(
        function(response, status, jqXhr) {
            alert("Success!");
            pagePreview.empty();
            pagePreview.append(response);
            // i feel you need to parse the response for the google map div, and perform another $.get() of the google url?
        }).error(function(response, status, jqXhr) {
        alert("These are not the droids you are looking for. move along.");
    }).complete(function(response, status, jqXhr) {
        alert("Complete!");
    });
</script>

#Why

jQuery.load() will get you on the documentation. .load is equivalent to this

It is roughly equivalent to $.get(url, data, success) except that it
is a method rather than global function and it has an implicit
callback function. When a successful response is detected (i.e. when
textStatus is “success” or “notmodified”), .load() sets the HTML
contents of the matched element to the returned data.

You need to register in $.ajax( complete:function(responseText, textStatus, XMLHttpRequest)){}); and check the textStatus value. if ok, then load the data into the destination $('selector') yourself. Or fix the .load() by watching your network xmlHttpRequests in chrome (ctrl + shift +j) or some network tab in firebug and debug the issue with your ‘url’ value in $('selector').load( 'url', function(response, status, xhr){})