CODEWITHSUNDEEP
jqueryjson
Flavio Caruso
Flavio Caruso

Reputation: 819

How i get an element from an array Json with no name using JQuery

I'm trying to get the first element from JSON called "Title" and pass to my id called "episodio1", but i don't know how to access the array correctly. Here is the code i'm trying to use.

$.getJSON('example.json', function(dataep) {
                   $('#episodio1').html('' + dataep.Title + '');
               });
  <button class="btn btn-link" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne" id="episodio1">Text</button>

Here is my JSON file.

[
  {
    "Duration": 53,
    "EpisodeNumber": 1,
    "ID": "EPI-01",
    "Image": "https://occ-0-894-1123.1.nflxso.net/art/e0e90/292975320f88a9f3fc741c132d0ec2ac20ce0e90.webp",
    "SeasonNumber": 1,
    "Synopsis": "Londres, 1891. A polícia investiga uma série de assassinatos, mas Sir Malcolm Murray e a bela Vanessa Ives sabem que há algo mais sombrio por trás de tudo.",
    "Title": "Trabalho Noturno"
  },
  {
    "Duration": 56,
    "EpisodeNumber": 2,
    "ID": "EPI-02",
    "Image": "https://occ-0-894-1123.1.nflxso.net/art/7b23c/f2a507d45fe0faa3716b7744dbefdb815c77b23c.webp",
    "SeasonNumber": 1,
    "Synopsis": "Vanessa e Sir Malcolm vão a uma festa na casa do egiptólogo Sir Ferdinand Lyle e encontram o belo e enigmático Dorian Gray.",
    "Title": "Sessão Espírita"
  },
  null,
  {
    "Duration": 48,
    "EpisodeNumber": 3,
    "ID": "EPI-03",
    "Image": "https://occ-0-894-1123.1.nflxso.net/art/4535e/74af6d7d64b7afbbadfa1398e1fab55835d4535e.webp",
    "SeasonNumber": 1,
    "Synopsis": "O Dr. Frankenstein enfrenta seu passado. Vanessa tem uma visão de Mina, levando o grupo a capturar Fenton, servo de um vampiro.",
    "Title": "Ressurreição"
  }
]

Thank you for the help.

Upvotes: 0

Views: 73

Answers (2)

NullPointer
NullPointer

Reputation: 7368

An array can hold many values under a single name, and you can access the values by referring to an index number.

var dataep=[
  {
    "Duration": 53,
    "EpisodeNumber": 1,
    "ID": "EPI-01",
    "Image": "https://occ-0-894-1123.1.nflxso.net/art/e0e90/292975320f88a9f3fc741c132d0ec2ac20ce0e90.webp",
    "SeasonNumber": 1,
    "Synopsis": "Londres, 1891. A polícia investiga uma série de assassinatos, mas Sir Malcolm Murray e a bela Vanessa Ives sabem que há algo mais sombrio por trás de tudo.",
    "Title": "Trabalho Noturno"
  },
  {
    "Duration": 56,
    "EpisodeNumber": 2,
    "ID": "EPI-02",
    "Image": "https://occ-0-894-1123.1.nflxso.net/art/7b23c/f2a507d45fe0faa3716b7744dbefdb815c77b23c.webp",
    "SeasonNumber": 1,
    "Synopsis": "Vanessa e Sir Malcolm vão a uma festa na casa do egiptólogo Sir Ferdinand Lyle e encontram o belo e enigmático Dorian Gray.",
    "Title": "Sessão Espírita"
  },
  null,
  {
    "Duration": 48,
    "EpisodeNumber": 3,
    "ID": "EPI-03",
    "Image": "https://occ-0-894-1123.1.nflxso.net/art/4535e/74af6d7d64b7afbbadfa1398e1fab55835d4535e.webp",
    "SeasonNumber": 1,
    "Synopsis": "O Dr. Frankenstein enfrenta seu passado. Vanessa tem uma visão de Mina, levando o grupo a capturar Fenton, servo de um vampiro.",
    "Title": "Ressurreição"
  }
]
console.log(dataep[0].Title);
//$('#episodio1').html('' + dataep[0].Title + '');
$.getJSON('example.json', function(dataep) {
                   $('#episodio1').html('' + dataep[0].Title + '');
               });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="btn btn-link" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne" id="episodio1">Text</button>

Upvotes: 2

Haider Ali
Haider Ali

Reputation: 1121

Since its array of objects so you should do it like this. This will pick up the title of the first object in the array. For getting all you can loop through the array

$.getJSON('example.json', function(dataep) {
   $('#episodio1').html('' + dataep[0].Title + '');
});

Upvotes: 2

Related Questions