Recuperar nome e valor do campo em string JSON

[FabianoSouza 5]

Primeiramente preciso saber se minha string JSON está correta.

 

[{"Codigo":1,"Data":"02/12/2013 09:20:28"},{"Codigo":2,"Data":"07/04/2013 19:38:58"},]

 

Em cada site fala que o padrão é de um jeito... Uma luz pelo amor de Deus!

 

Em seguida preciso saber como pegar (em JS) o nome do campo e seu respectivo valor.

To fazendo assim.

function listaDados()
{
var obj_itens = createXMLHTTP(); 
obj_itens.open("post", "teste.asp", true); 
obj_itens.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
obj_itens.onreadystatechange=function(){
if (obj_itens.readyState==3){
}
else
if (obj_itens.readyState==4){ 
var string_json = eval(obj_itens.responseText);

//Define quantidade de linhas
var linhas = string_json.length;

var linhas = string_json.length;

var colunas = 1; //Define qtde de colunas (aqui deveria ser dinâmico, conforme a quantidade de colunas retornadas do JSON)

var context = document.createElement('table');
  context.border = "1px";
  context.cellSpacing = "1px";
  context.width = "100%";

context.className = 'table';
var header = context.createTHead();
var row = header.insertRow();

for (var i = 0; i < colunas; i++) {
    var th = document.createElement('th');
    th.innerHTML = 'Coluna ' + i; // 
    row.appendChild(th);
};

var body = context.appendChild(document.createElement('tbody'))
for (var i = 0; i < linhas; i++) {
    var row;
    row = body.insertRow();
    for (var j = 0; j < colunas; j++) {
        row.insertCell().innerHTML = (string_json[i]) // AQUI deveria aparecer os valores dos campos

    };
};
            var container = document.getElementById ("datagridview");
            container.appendChild (context);
}
}
obj_itens.send(null);
}

O trecho que cria a tabela está 100% funcional. Usei este script http://jsfiddle.net/M49SH/ obtido aqui mesmo no fórum.

O AJAX tb está carregando dados.

 

O problema é que não sei como pegar o nome do campo e seu respectivo valor e popular as células da tabela (inclusive o cabeçalho) criada dinamicamente.

As linhas ficam assim [object Object]

 

Se tirar os loops eu colocar manualmente os nomes de campo e nome dos objetos retornados até funciona. Mas se for pra fazer isso é melhor não fazer, né? A coisa tem que ser dinâmica!

 

Obrigado desde já.

[paulojuchem 20]

vamos lá:

var a = JSON.parse('[{"Codigo":1,"Data":"02/12/2013 09:20:28"},{"Codigo":2,"Data":"07/04/2013 19:38:58"},]');
/*
   resultado:
   SyntaxError: JSON.parse: unexpected character at line 1 column 86 of the JSON data
*/
//o correto seria:
var a = JSON.parse('[{"Codigo":1,"Data":"02/12/2013 09:20:28"},{"Codigo":2,"Data":"07/04/2013 19:38:58"}]');//note que tinha uma vírgula no final que foi removida

beleza, agora você sabe como a string deve ser para que o json esteja correto.

obs.: o eval aceita a String JSON que você colocou, mesmo com vírgula

agora vamos ao erro Object Object

quando você deu o eval la em cima no json que veio do teu servidor, ele gerou vários objetos com as caracteristicas que você definiu, no caso Codigo e Data. Se você quer mostrar esses dados, você precisa dizer qual deles você quer mostrar, por exemplo:

row.insertCell().innerHTML = (string_json[i]) // AQUI deveria aparecer os valores dos campos ==== isso vai mostrar object object mesmo, o correto seria:
row.insertCell().innerHTML = (string_json[i].Codigo+" "+string_json[i].Data);//pronto, agora mostra o codigo e a data.

faz um teste, acredito que isso vai te ajudar.

A variavel string_json é uma array, a posicao 0 é um objeto, se você escrever ela inteira no html aparece object object, por isso você tem que especificar qual propriedade do objeto você quer

[FabianoSouza 5]

Olá paulojuchem. Agradeço desde já. Já ajudou bastante.

A vírgula no final do JSON é resultado da biblioteca VBS JSON 2.0.3 (em ASP) que uso no server. Como faço meu js tirar essa vírgula? Acho que preciso usar outra biblioteca no server...

 

Sobre a exibição dos campos.

Isso aqui

row.insertCell().innerHTML = (string_json[i].Codigo+" "+string_json[i].Data)

realmente vai exibir os dados e campos. Porém, o que espero conseguir é exibir os valores (e campos) sem precisar declarar cada objeto.

 

Veja meu raciocínio. O array carrega, além dos valores, o nome de cada "campo", né? Sendo assim, por que preciso escrever no código o nome deles?

Quero saber se é possível exibir todos os campos sem que eu precise "declara-los" no código.

Uma comparação para ilustrar. Sabe em SQL quando se faz SELECT * FROM Tabela, ? Isso trás todos os campos da tabela, certo?

Quero fazer algo similar neste código, fazer um loop que escreva todos os objetos do array sem precisar escrever p nome de cada um. Assim terei os valores e nome das colunas da tabela automaticamente :-)

 

É possível ou estou viajando nas ideias?

 

Valew.

[paulojuchem 20]

você poderia colocar algo nessa estrutura:

data = {
     cabecalho : ['ID' , 'Nome', 'Data', N],
     data : [
     { id: 1 , nome : 'aaa' , data : 'bbbb' , n},
     .....
     ]
}

dai tu percorre ela

var thead = document.getElementById('thead');
for(var i in data.cabecalho)
{
      //cria la a th ou nao sei como tu quer o cabecalho
      var a = document.createElement('th');
      a.innerHTML = data.cabecalho[i];
      thead.appendChild(a);
}
tbody = document.getElementById('tbody');//ou cria ele aqui e insere aonde você quiser
//e os dados você pode fazer 2 loops, um para percorrer todos os dados e outro para percorrer cada um
for(var i in data.data)
{
     //nesse loop tu cria a tr
     var a = document.createElement('tr');
     for(var j in data.data[i])
     {
           //aqui você cria as celulas
           var b = document.createElement('td');
           b.innerHTML = data.data[i][j];
           a.appendChild(b);
     }
     tbody.appendChild(a);
}