dimanche 28 juin 2015

AJAX Parsing HTML returns [object Object]

I'm trying to load a page in with AJAX using a method I found here.

Everything goes well until I get to the parse_html function. The correct values from the elements on the next webpage are assigned to the body variable (that is, a string of the HTML code from the body tag). But when it turns that into the jQuery object, $body ends up being equal to Object (which I think is maybe correct? I THINK this is a DOM object that has all the HTML from the body tags in it).

Finally, the jQuery object "$content" is made equal to the contents of the first "#content" element. However, response.$content ends up being equal to "[object Object]".

How do I make it so that when I use $content.html(response.$content) the #content div is filled with the HTML from the new page instead of [object Object].

function find_all($html, selector) {
  return $html.filter(selector).add($html.find(selector));
}

function parse_html(html) {
  return $($.parseHTML(html, document, true));
}

// Convert page contents to jQuery objects
function parse_response(html) {

  // 'body' is equal to the strings of text in between the body tags
  var body = /<body[^>]*>([\s\S]+)<\/body>/.exec(html),

  $body = body ? parse_html(body[1]) : $(),

  // '$content' is equal to the contents of the first #content element
  $content = $.trim(find_all($body, '#content').first().contents());

  // Output the variable "$content"
  return {
    '$content': $content
  }
}

For context, here is where I call these functions inline:

url = History.getState().url,
rel = url.replace(root, "/");
$.get(rel).done(function (data) {

    var response = parse_response(data);

    var $content = $("#content");

    $content
        .slideUp(500) // Get it off screen to start
        .promise()
        .done(function () {
            $content
                .html(response.$content)
                .slideDown(500);
        });
}).fail(function () {
            document.location.href = url;
            return false;
});

Aucun commentaire:

Enregistrer un commentaire