3

Eu tenho o seguinte 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": "Teste@Teste.com",
      "ddd": "41",
      "telCelular": "(41)123456789",
      "telResidencial": "123456789",
      "telComercial": "12345-6789"
    }
}
]

e eu queria acessar os dados com o JS eu costumo fazer um for(i in response.content) e vou acessando com o response.content[i].nome, porém não estou conseguindo. Está retornando undefined. Alguem sabe o que é?

(o JSON é recebido via $.get)

3

4 Respostas 4

1

Você está recebendo seu arquivo .json em formato de texto do servidor. A melhor forma de resolver isso é alterar seu código no servidor para enviar o arquivo .json com o header apropriado. Em PHP seria mais ou menos assim:

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

Dessa forma, quando você pegar o arquivo via $.get() o próprio jQuery vai fazer a conversão apropriada e lhe retornar um objeto JavaScript.


Agora, se você não tiver acesso ao código do servidor que envia o arquivo .json, basta fazer a conversão dentro da função $.get() utilizando a função JSON.parse(), que recebe uma string e devolve um objeto. Exemplo:

$.get(
  'https://gist.githubusercontent.com/tayllan/ea6a43e6ee843a4a3c05/raw/c7713343dc5e68843bd8646b80a5d80898fc4c79/104024.json',
   function(response) {
     response = JSON.parse(response);

     for (var i = 0; i < response.length; i++) {
        document.write(response[i].nome + '<br>'); // "Matheus Almeida Siccenna"
        document.write(response[i].contato.email); // "Teste@Teste.com"
     }
   }
);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

0

Joga esse resultado em uma variavel e trabalhe com ela.

var dataJson = [
  {
    "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": "Teste@Teste.com",
      "ddd": "41",
      "telCelular": "(41)123456789",
      "telResidencial": "123456789",
      "telComercial": "12345-6789"
    }
}
];
$('div').html(dataJson[0].nome);
1
  • 1
    Pq da negativa?
    – RBoschini
    15/12/2015 às 18:15
0

Veja se isso clareia

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": "Teste@Teste.com",
    "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>

0

Funciona perfeitamente aqui, é só declarar a variável i:

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": "Teste@Teste.com",
                    "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>

JSFiddle de exemplo

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .