How do I insert this json data into the datatable?

klermann

Hello, I'm sending ajax data to the data base and am replying to the json data. How do I insert this json data into the datatable?
See the details!
`
$.ajax({
type : 'GET',
url : '/financeiro/despesas/filtrarDespesas',
data : dados,
dataType: 'json',
success : function(response){
console.log(response);
oTable.rows().remove();
oTable.ajax.load();
oTable.draw();
oTable.ajax.reload();

                 }
          });`

kthorngren

Try rows.add() to add your data.

Kevin

klermann

I followed its indication, but it seems to me that the table does not update and when it uses theTable.ajax.reload (), it returns the previous data.
` $.ajax({
type : 'GET',
url : '/financeiro/despesas/filtrarDespesas',
data : dados,
dataType: 'json',
success : function(response){
console.log(response);

                    oTable.rows().remove();
                    oTable.rows.add(response);
                    oTable.ajax.reload();
                 }
              });`

kthorngren

ajax.relaod() is going to fetch the data based on your ajax data source. In this case I don't think you want to use that API. in the rows.add() doc it indicates to use draw() to redraw the updated Datatable. You will want to use:

oTable.rows.add(response).draw();

Kevin

klermann

Using your example does not update the data in the table. I'm using the editor. Do you have a suggestion?

oTable.rows.add(response).draw();

{ "iTotalRecords": 1, "iTotalDisplayRecords": 1, "data": [ { "id": 22, "descricaoDespesa": "Aluguel 01", "dataDespesa": { "dayOfMonth": 2, "dayOfWeek": "MONDAY", "month": "APRIL", "year": 2018, "dayOfYear": 92, "monthValue": 4, "hour": 13, "minute": 40, "nano": 0, "second": 44, "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "valorDespesa": 1400, "status": "Pago", "pagamento": true, "tipoDespesas": [ { "id": 8, "nomeTipoDespesas": "Aluguel", "corTipoDespesas": "#991e5f", "dataTipoDespesas": { "year": 2018, "month": "APRIL", "dayOfMonth": 13, "dayOfWeek": "FRIDAY", "era": "CE", "dayOfYear": 103, "leapYear": false, "monthValue": 4, "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "descricaoTipoDespesas": "Nenhuma observação", "valorDespesas": null, "quantidadeDespesas": null, "definicaoDespesas": null, "listMinhasDespesas": null, "usuario": { "id": 2, "nome": "admin", "email": "admin@email.com", "senha": "$2a$10$A8HldPtNQva9fTGR.jNKKet6klmFov1jAcXVf4q7VZmZzJx9BdSPW", "dataCadastro": { "year": 2018, "month": "MARCH", "dayOfMonth": 26, "dayOfWeek": "MONDAY", "era": "CE", "dayOfYear": 85, "leapYear": false, "monthValue": 3, "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "foto": null, "urlPath": null, "perfil": "ADMIN", "avatar": null, "minhasDespesas": null, "minhasReceitas": null, "catTipoDespesas": null, "catTipoReceitas": null, "minhasContas": null, "transferencias": null, "definirGastos": null, "assinaturas": null, "atualizaMesAno": null, "configUsuario": null }, "definirGastos": null } ], "catDespesaId": 8, "nomeCategoria": "Aluguel", "minhasContas": [ { "id": 15, "nomeMinhasContas": "Conta A", "dataAcesso": { "dayOfMonth": 1, "dayOfWeek": "SUNDAY", "month": "APRIL", "year": 2018, "dayOfYear": 91, "monthValue": 4, "hour": 0, "minute": 5, "nano": 0, "second": 1, "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "saldoAnterior": 10, "saldoAtual": 116.04, "saldoFinal": 0, "saldoBruto": 5520, "tipo": "Carteira", "cor": "#fa32dc", "dashBoard": true, "descricaoMinhasContas": "CONTAS", "numeroId": 15, "usuario": { "id": 2, "nome": "admin", "email": "admin@email.com", "senha": "$2a$10$A8HldPtNQva9fTGR.jNKKet6klmFov1jAcXVf4q7VZmZzJx9BdSPW", "dataCadastro": { "year": 2018, "month": "MARCH", "dayOfMonth": 26, "dayOfWeek": "MONDAY", "era": "CE", "dayOfYear": 85, "leapYear": false, "monthValue": 3, "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "foto": null, "urlPath": null, "perfil": "ADMIN", "avatar": null, "minhasDespesas": null, "minhasReceitas": null, "catTipoDespesas": null, "catTipoReceitas": null, "minhasContas": null, "transferencias": null, "definirGastos": null, "assinaturas": null, "atualizaMesAno": null, "configUsuario": null } } ], "despesaFixa": false, "despesaFixaQuantida": null, "despesaFixaTempo": null, "repetirLancDespesa": false, "repetirPorPeriodo": null, "addObservacao": null, "grupoDespesas": { "nomeGrupoDespesas": "Essencial" }, "grupos": 1, "cor": "#e60000" } ] }

kthorngren

With rows.add() you just want to add the data object. Try:

oTable.rows.add(response.data).draw();

Kevin

klermann

Not updating, very strange!

klermann

Run here. Perfect! Thanks!