frshjb373 frshjb373 - 1 year ago 91
Javascript Question

Output html from ajax/jsonp request using jQuery

I'm trying to output html using an ajax request from a jsonp file . When using

console.log
I'm seeing the data looping fine, however when using a variable to grab the loop and output in html, I'm only seeing one result. What am I missing?

$.ajax({
url: "http://sitedotcom/blog/json",
dataType: "jsonp",
jsonpCallback: "jsonpCallback",
success: jsonpCallback
});

function jsonpCallback(data) {
for (var key in data) {
if (data.hasOwnProperty(key)) {
console.log(data[key]["title"] + ", " + data[key]["entry_id"]);
rssData = '<h2>' + data[key]["title"] + "</h2><p>" + data[key]["blog_summary"] + "</p>";

}
$('#blog-content').html(rssData);
}
}

Answer Source

You have $('#blog-content').html(rssData); inside the loop....so only the last result will show since html() replaces all content.

Try using append() instead or concatenate rssData each iteration and set html() after loop completes

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download