[Solved] [JSON] Refreshing a request
[Idiot mistake, fixed it, see followup post!]
I'm using some jQuery to work with the Last.FM API, and I'm stuck where I need to allow the user to run he JSON request a second time after the page loads (it loads once automatically when the page loads, the second time is when they push a button).
What happens currently, is the JSON function is fed some default data when the page loads:
-
$('#graph').lastFM({
username: 'UserName',
from: 1254369600,
to: 1256184000,
apikey: 'myApiKeyHere',
onComplete: function(){
//Done
}
});
The JSON function:
-
$.fn.lastFM = function(options) {
var defaults = {
username: 'Verdani',
apikey: 'e4f3bb251d13179bf7ce80a089fb3d0c',
onComplete: function(){}
},
settings = $.extend({}, defaults, options);
var lastUrl = 'http://ws.audioscrobbler.com/2.0/?method=user.getweeklyartistchart&user='+settings.username+'&api_key='+settings.apikey+'&from='+settings.from+'&to='+settings.to+'&format=json&callback=?';
var $this = $('#graph');
console.log('http://ws.audioscrobbler.com/2.0/?method=user.getweeklyartistchart&user='+settings.username+'&api_key='+settings.apikey+'&from='+settings.from+'&to='+settings.to+'&format=json&callback=?');
$('#wrapper').append('<img src="style/img/loader.gif" alt="Loading..." id="loading" />');
this.each(function() {
$.getJSON(lastUrl, function(data){
$.each(data.weeklyartistchart.artist, function(i, item){
url = stripslashes(item.url);
name = item.name;
playcount = item.playcount;
$('#graph').append('<li id="item-' + i + '"></li>');
animQueue.push(playcount); //push this artist's play count to the animation queue
titleQueue.push(name); //push this artist's play count to the animation queue
if(i==(settings.number-1)){
settings.onComplete.call(this);
}
});
});
});
};
function stripslashes( str ) {
return (str+'').replace(/\0/g, '0').replace(/\\([\\'"])/g, '$1');
}
This runs perfectly. What's next is when the user clicks a button, the JSON runs again, but with different data - namtly the 'to' and 'from' values change, here's the new request:
-
$('#menuitem').click(function(){
$('#graph').lastFM({
username: 'UserName',
from: 1254369600,
to: 1256409902,
apikey: 'myApiKeyHere',
onComplete: function(){
//Done
}
});
});
So only the to and from values have changed.
THE ISSUE:
You might have noticed in the JSON, I write the URL the JSON is requesting to the console every time it runs. When I click this button, a new URL pops up in the console below the first one but only for a second, and then the page reloads and the original JSON request is called. It's this loop that I can't seem to break out of - why does re-calling the JSON refresh the page?
Any help would be greatly appreciated, long post I know but thank you for your time!
Gavin