Access JSON with multiple objects in JS

Navigation
3

I have the following JSON 

[
  {
    "id": 1,
    "nome": "Matheus Almeida Siccenna",
    "cpf": null,
    "matricula": {
      "id": 555,
      "empresa": 1,
      "unidade": 0,
      "descricaoUnidade": null,
      "curso": 1,
      "descricaoCurso": null,
      "serie": 1,
      "descricaoSerie": null,
      "turma": 3,
      "descricaoTurma": null,
      "periodo": "Manhã",
      "ativo": false
    },
    "contato": {
      "email": "[email protected]",
      "ddd": "41",
      "telCelular": "(41)123456789",
      "telResidencial": "123456789",
      "telComercial": "12345-6789"
    }
}
]

and I wanted to access the data with JS I usually make a for(i in response.content) and I access it with response.content[i].nome but I can not. It is returning undefined . Does anyone know what it is?

(JSON is received via $ .get)

    
asked by anonymous 15.12.2015 / 18:27

4 answers

1

You are receiving your .json file in text format from the server. The best way to resolve this is to change your code on the server to send the .json file with the appropriate header . In PHP it would look something like this: 

<?php
$data = ''; // Seu JSON vai aqui
header('Content-Type: application/json');
echo json_encode($data);

That way, when you get the file via $.get() jQuery itself will do the proper conversion and return you a JavaScript object.

Now, if you do not have access to the server code that sends the .json file, just do the conversion within the $.get() function using the

22.03.2016 / 13:50
0

See if that lightens up 

var json = [{
  "id": 1,
  "nome": "Matheus Almeida Siccenna",
  "cpf": null,
  "matricula": {
    "id": 555,
    "empresa": 1,
    "unidade": 0,
    "descricaoUnidade": null,
    "curso": 1,
    "descricaoCurso": null,
    "serie": 1,
    "descricaoSerie": null,
    "turma": 3,
    "descricaoTurma": null,
    "periodo": "Manhã",
    "ativo": false
  },
  "contato": {
    "email": "[email protected]",
    "ddd": "41",
    "telCelular": "(41)123456789",
    "telResidencial": "123456789",
    "telComercial": "12345-6789"
  }
}];

dump(json);

function dump(obj) {
  $.each(obj, function(chave, valor) {
    console.log(chave, valor, $.type(valor));

    if ($.type(valor) == 'object') {
      dump(valor)
    } else {
      $('div').append(chave + ':' + valor + '<br>')
    }
  });
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div></div>
    
15.12.2015 / 19:54
0

It works perfectly here, just declare the i variable:

JavaScript: 

var response = [
                {
                  "id": 1,
                  "nome": "Matheus Almeida Siccenna",
                  "cpf": null,
                  "matricula": {
                    "id": 555,
                    "empresa": 1,
                    "unidade": 0,
                    "descricaoUnidade": null,
                    "curso": 1,
                    "descricaoCurso": null,
                    "serie": 1,
                    "descricaoSerie": null,
                    "turma": 3,
                    "descricaoTurma": null,
                    "periodo": "Manhã",
                    "ativo": false
                  },
                  "contato": {
                    "email": "[email protected]",
                    "ddd": "41",
                    "telCelular": "(41)123456789",
                    "telResidencial": "123456789",
                    "telComercial": "12345-6789"
                  }
              }
            ];
var content='';
for (var i in response) {
   content+='<h3>Dados do estudante:</h3>\
          <div class="usuario">Id: '+response[i].id+'<br>\
                  Nome: '+response[i].nome+'<br>\
                  CPF: '+response[i].cpf+'<br>\
          </div>\
          <h3>Matrícula:</h3>\
          <div class="matricula">Id matrc: '+response[i].matricula.id+'<br>\
                  Empresa: '+response[i].matricula.empresa+'<br>\
                  Unidade: '+response[i].matricula.unidade+'<br>\
                  Curso: '+response[i].matricula.curso+'<br>\
                  Série: '+response[i].matricula.serie+'<br>\
                  Período: '+response[i].matricula.periodo+'<br>\
         </div>\
         <h3>Informações de contato:</h3>\
         <div class="contato">Email: '+response[i].contato.email+'<br>\
                  DDD: '+response[i].contato.ddd+'<br>\
                  Tel Celular: '+response[i].contato.telCelular+'<br>\
                  Tel Residencial: '+response[i].contato.telResidencial+'<br>\
                  Tel Comercial: '+response[i].contato.telComercial+'<br>\
         </div>';
}
document.getElementById('content').innerHTML=content;

HTML: 

<div id="content"></div>

Sample JSFiddle

    
15.12.2015 / 23:01
Submit when typing in the input type text for the php code on the same page How to make an extract inside a function without the variables colliding with the parameter variables?