0

I'm trying to combine movie data from OMDBAPI with myown data which is some additional information about the movie.

Myjson data // I have 10 movies

{
"Movie1": {
    "id": "01",
    "Title": "Disney Princess Enchanted Tales: Follow Your Dreams",
    "Characters": ["Sleeping Beauty"," Princess Jasmine"," Rajah", " Jago", " Kong Stefan", " Kong Henrik", " Fauna", " Flora"],
    "Actors": ["Erin Torpey", " Lea Salong", " Frank Welker", " Gilbert Gottfried", " Corey Burton", " Jeff Bennett", " Russi Taylor", " Barbara Dirikson"],
    "DirectedBy": "David Block",
    "ProducedBy": ["Kurt Albrecht", " Douglas Segal"]
},
"Movie2": {
    "id": "02",
    "Title": "Disney Princess Stories Volume Two: Tales of Friendship",
    "Characters": ["Ariel", " Snow White", " Princess Jasmine", " Girl"],
    "Actors": ["Jodi Benson", " Carolyn Gardner", " Linda larkin", " Ashley Edner"],
    "DirectedBy": ["Rob LaDuca", " Jamie Mitchell", " Kazou Terada"],
    "ProducedBy": ["Paul Betzold", " Andrew Carlson"]
},

FUNCTION

I'm trying to append the OMDBAPI data in a ul and a li. And as you can see i'm also trying to loop through 1-10 and inside the loop appling my json which i'm trying to display with a id and the iterated i number.

//now we are querying and prepare the results for display;
$(document).ready(function() {
  $.getJSON(omdb_request, function(results) {

    console.log(omdb_request);

    $.each(results.Search, function(idx, item) {
      for (var $i = 1; $i <= 10; i++) {
        $.getJSON("json/Metadata.json", function(myjson) {
          console.log(myjson);

          $('ul.movie_list').append('<li><p><strong>Title:</strong> ' + results.Search[idx].Title + '</p><p><strong>Year:</strong> ' + results.Search[idx].Year + '</p><img src="' + results.Search[idx].Poster + '" alt="' + results.Search[idx].Title + '"</img><div id="myjson' + $i + '"></div></li>');
          i++;
        })

      };
    });
  })
});

I'm adding this picture to show my results in the inspectertool in chrome inspectortool

Another picture to show what i would like to do picture

I hope you can help me with my function maybe i can do something instead of my forloop?

Barmar
  • 741,623
  • 53
  • 500
  • 612
Mg10
  • 29
  • 4
  • 1
    The iteration variable is `$i`, but you're incrementing `i`. – Barmar Jan 12 '21 at 23:55
  • See https://stackoverflow.com/questions/1451009/javascript-infamous-loop-issue regarding your use of `$.getJSON()` in the `for` loop. – Barmar Jan 13 '21 at 00:03

1 Answers1

0

Lets say you have two object one is your custom data:

var myData={
"movieName":"ABC"
}

and another one from the api

var apiData={
"movieName":"DEF"
}

Then you can merge it and save it into another variable.

const mergedVar = {};
$.extend(mergedVar , myData, apiData);

In you case you can save the result from the api to a new variable and merge it. You can read more about $.extend here enter link description here

Barmar
  • 741,623
  • 53
  • 500
  • 612
Jayant
  • 98
  • 8