HTML and CSS Reference
In-Depth Information
It is important to note that simply calling the
replace
function doesn't work, because the
replace
function only replaces the first occurrence of the matching string. You need to wrap the string to
replace it in a regular expression (as shown below) and explicitly add the
g
qualifier to make it work
on the entire string.
/string-to-replace/g
The code that parses the JSON becomes
flickrApp.parseFeed = function (json) {
var amendedText = json.doubleEscapeSingleQuotes();
var pictures = JSON.parse(amendedText);
for (var i = 0; i < pictures.items.length; i++) {
var pictureElement = {};
pictureElement.photoUrl = pictures.items[i].media.m;
// Add the object to the listview
FlickrFeed.Pictures.push(pictureElement);
}
}
With this added code, you should be able to correctly parse Flickr JSON in every case you've
encountered so far.
Displaying a different set of photos
To complete the exercise, you might want to add a second button to clear the currently displayed
photos. The function you're going to create is also useful for silently clearing the view when the user
starts a new search. Note that without a “clear” step, any new search will just append photos to the
existing list.
To add the Clear button, add the following markup to the
default.html
page:
<button id="buttonClear">Clear</button>
Next, in
flickrApp.init
, you register a handler for the button's
click
event.
flickrApp.init = function () {
document.getElementById("buttonSearch")
.addEventListener("click", flickrApp.searchClick);
document.getElementById("buttonClear")
.addEventListener("click", flickrApp.clearClick);
}
Search WWH ::
Custom Search