Digital Business Application

Added on - 16 Sep 2019

  • 3

    pages

  • 1334

    words

  • 103

    views

  • 0

    downloads

Showing pages 1 to 1 of 3 pages
Digital Business Application – Lab ExercisesJavaScript and AjaxEXERCISE 2: PHOTO ALBUM CLIENT-RENDERED VERSION BPhoto Album Client-Rendered Version BJust as the first PHP photalbum we created had the photographs hard coded in an array, the firstversion of the JavaScript version also hard coded the photographs, in the form of a JSON string. Thesecond PHP version deleted the array and got the list of photographs from the database instead.Now we will do something similar with the JavaScript version. Make a copy ofphoto-album-client-rendered-a.htmland call itphoto-album-client-rendered-b.htmlthen delete the json stringdeclaration at the top:var json = '[' +'{ "image": "b1.png", "name": "John", "description": "<p>This is JohnLennon. He was one of the Beatles.</p><p>He was one of the two main song-writers.</p>" },' +'{ "image": "b2.png", "name": "Paul", "description": "<p>This is PaulMcCartney. He was also one of the Beatles.</p><p>He was the other mainsong-writers.</p>" },' +'{ "image": "b3.png", "name": "George", "description": "<p>This isGeorge Harrison. He was also one of the Beatles.</p>" },' +'{ "image": "b4.png", "name": "Ringo", "description": "<p>This isRingo Starr. He was also one of the Beatles.</p>" }' +']';DELETE THIS CODEKEEP thecreatePhotoHTMLfunction, but delete the existing function that displays the photos asshown below:$( document).ready(function() {var photos = $.parseJSON( json);for (i = 0; i < photos.length; i += 3) {var rowDiv = $( "<div class='w3-row'>");$('#album').append( rowDiv);for( j = i; j < i + 3; j++ ) {if ( j < photos.length) {rowDiv.append( createPhotoHTML( photos[j]));}}}});DELETE THIS CODEPage1of3
desklib-logo
You’re reading a preview
card-image

To View Complete Document

Become a Desklib Library Member.
Subscribe to our plans

Unlock This Document