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