From 79c10bd334be00c9e29cc7e3b3337145a2ff55ba Mon Sep 17 00:00:00 2001 From: rw400 Date: Tue, 27 Nov 2018 17:41:16 -0500 Subject: [PATCH] labtest Jquery Ronnie --- index.html | 35 +++++++++++++++++++++++++++++++++++ index.js | 49 +++++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 84 insertions(+) create mode 100644 index.html create mode 100644 index.js diff --git a/index.html b/index.html new file mode 100644 index 0000000..605099f --- /dev/null +++ b/index.html @@ -0,0 +1,35 @@ + + + + + + + Labtest Jquery Ronnie + + + + + + + + +

Nasa Image Previewer

+ + +
+ +
+ +
+ +
+ + + \ No newline at end of file diff --git a/index.js b/index.js new file mode 100644 index 0000000..c44c236 --- /dev/null +++ b/index.js @@ -0,0 +1,49 @@ +//Populate 12 Pictures to Container class +function addPicture(picture){ + for (i = 0; i < 12; i++){ + + $('#container').prepend($('', {id='pic', src='picture.collection.items[i].links[0].href', + height='400', width= '400', style='border:2px solid black'})) + + } +} +$(document).ready(function (){ + + var $pictures = $('#pictures'); + + //get request + $.ajax({ + type: 'GET', + url:'https://images-api.nasa.gov/', + success: function(pictures){ + console.log('success', pictures); + $.each(pictures, function(x, picture){ + //call add picture function + addPicture(picture); + }); + }, + // Error message + error: function(){ + alert('loading error'); + } + }); + + $('button').on('click', function(){ + + $.ajax({ + type: 'GET', + url:'https://images-api.nasa.gov/', + success: function(newPictures){ + console.log('success', newPictures); + addPicture(picture); + + }, + //Error Message + error: function(){ + alert('loading error'); + } + }); + + }); + +}) \ No newline at end of file