Load table with json using Datatables

3

I'm using the jquery Datatables version 1.10.7 plugin.

I'm trying to load a table following the following structure:

JSON

{
    "d:" [
        {   "IdNotificacao":null,
            "Contrato":{
                "id":631,
                "serie":2210618,
                "dataAdesao":"29/04/2015",
                "diaVencimento":16,
                "contribuicaoMensal":0.9259
            },
            "PagamentoDoContrato":[{
                "$id":"6",
                "id":16072,
                "idContrato":631,
                "parcela":1,
                "valorBruto":328.70,
                "valorLiquido":323.77,
                "dataPagamento":"30/04/2015"                
            }],
            "Assembleia":{"$ref":"3"},
            "GrupoCota":{"$ref":"2"},
            "Cliente":{
                "$id":"9",
                "id":631,
                "cpf_cnpj":"1xx3xx1xx7x",
                "nome":"JESSICA ABDC",
                "renda":2500.00
            },          
            "TipoDaNotificacao":null,
            "CanalDeEnvio":"SMS",
            "DataEnvio":"10/06/2015 14:24:33",
            "DataRecebimento":"10/06/2015 14:25:21",
            "DataLeitura":"",
            "Recebida":"Recebida",
            "Lida":"Não Lida",
            "ObservacaoRecebimento":"",
            "ObservacaoLeitura":"",
            "DestinatarioEnvio":"319xx88xx6"
        }
    ]
}

** Json is received via Ajax *.

Table to be generated

<script src="//cdn.datatables.net/1.10.7/js/jquery.dataTables.min.js"></script>
<link href="//cdn.datatables.net/1.10.7/css/jquery.dataTables.min.css" rel="stylesheet" />
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script><tableclass="table">
  <thead>
    <tr>
      <td>Contrato</td>
      <td>Serie</td>
      <td>Adesão</td>
      <td>Dia Vencimento</td>
      <td>Contribuição Mensal</td>
      <td>Parcela</td>
      <td>Valor Liquido</td>
      <td>Pagamento</td>
      <td>Documento</td>
      <td>Nome</td>
      <td>Renda</td>
      <td>Canal De Envio</td>
      <td>Envio</td>
      <td>Recebida</td>
      <td>Data</td>
      <td>Observação</td>
      <td>Destinatario</td>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>631</td>
      <td>2210618</td>
      <td>29/04/2015</td>
      <td>16</td>
      <td>0.9259%</td>
      <td>1</td>
      <td>R$ 323,77</td>
      <td>30/04/2015</td>
      <td>1xx.3xx.1xx-7x</td>
      <td>JESSICA ABDC</td>
      <td>R$ 2.500,00</td>
      <td>SMS</td>
      <td>10/06/2015 14:24:33</td>
      <td>Recebida</td>
      <td>10/06/2015 14:25:21</td>
      <td></td>
      <td>(31) 9xx8-8xx6</td>
    </tr>
  </tbody>
</table>

When you do not have list list in json, I do it as follows:

function(data) {
  var Dados = eval(data.d);
  
  $('#table_vencimento').dataTable({
    "bJQueryUI": true,
    "bLengthChange": false,
    "iDisplayLength": 10,
    "oLanguage": {
      "sUrl": "pt.txt"
    },
    data: Dados,
    columns: [{
      data: 'Cota'
    }, {
      data: 'CpfCliente'
    }, {
      data: 'NomeCliente'
    }, {
      data: 'DestinatarioEnvio'
    }, {
      data: 'DataEnvio'
    }, {
      data: 'Recebida'
    }, {
      data: 'DataRecebimento'
    }, {
      data: 'ObservacaoRecebimento'
    }, {
      data: 'Lida'
    }, {
      data: 'DataLeitura'
    }, {
      data: 'ObservacaoLeitura'
    }, {
      data: 'CanalDeEnvio'
    }, ]
  });
}

JSON

    {
    "d:" [
        {   "IdNotificacao":null,
            "TipoDaNotificacao":null,
            "CanalDeEnvio":"SMS",
            "DataEnvio":"10/06/2015 14:24:33",
            "DataRecebimento":"10/06/2015 14:25:21",
            "DataLeitura":"",
            "Recebida":"Recebida",
            "Lida":"Não Lida",
            "ObservacaoRecebimento":"",
            "ObservacaoLeitura":"",
            "DestinatarioEnvio":"319xx88xx6"
        }
    ]
}

This is a "no list" JSON.

MY PROBLEM

I'm not able to properly load a table using datatables , when JSON has several levels (or list list), as exemplified above.

    
asked by anonymous 11.06.2015 / 17:35

1 answer

3

When data is nested within other objects (multi-level), the notation with . (dot) must be used according to the documentation .

columns should have the following value:

[
  {data: 'Contrato.id'},
  {data: 'Contrato.Serie'},
  {data: 'Contrato.dataAdesao'},
  {data: 'Contrato.diaVencimento'},
  {data: 'Contrato.contribuicaoMensal'},
  {data: 'PagamentoDoContrato.parcela'},
  {data: 'PagamentoDoContrato.valorLiquido'},
  {data: 'PagamentoDoContrato.dataPagamento'},
  {data: 'Cliente.cpf_cnpj'},
  {data: 'Cliente.nome'},
  {data: 'Cliente.renda'},
  {data: 'CanalDeEnvio'},
  {data: 'DataEnvio'},
  {data: 'Recebida'},
  {data: 'DataRecebimento'},
  {data: 'ObservacaoRecebimento'},
  {data: 'DestinatarioEnvio'}
]
    
16.06.2015 / 21:22