Come analizzare JSON ricevuto dalla chiamata ajax di Datatables?

Question

Posso riempire correttamente il mio datatable con una chiamata ajax, ma non so come analizzare JSON ricevuto da datatable con questa chiamata ajax.

Ecco il mio codice JavaScript, che rende chiamata AJAX al server e riempie il mio datatable correttamente:

$('#transactions').DataTable({ 
     "processing": true, 
     "ajax": { 
      "url": "/transactions 
     }, 
     "columns": [ 
      { "data": "car"}, 
      { "data": "card_number"}, 
      { "data": "invoice"}, 
      { "data": "status"} 
     ] 
    }); 

Questo è l'oggetto JSON restituito dal server:

{ 
    "data": [ 
    { 
     "car": 190, 
     "card_number": "6395637", 
     "invoice": 200, 
     "status": "success" 
    }, 
    { 
     "car": 191, 
     "card_number": "9473650", 
     "invoice": 180, 
     "status": "success" 
    } 
    ], 
    "balance": 7300 
} 

come si può vedere, il parametro data dell'oggetto JSON restituito viene utilizzato dalla funzione di datatables da compilare in base ai datatables e ora voglio analizzare il parametro balance, ma non è possibile. Come posso raggiungere questo obiettivo?

Answer 1

Qualcosa di simile a questo:

$('#transactions').dataTable({ 
    "ajax" : { 
     "url" : "/transactions", 
     "dataSrc" : function (json) { 
      // manipulate your data (json) 
      ... 

      // return the data that DataTables is to use to draw the table 
      return json.data; 
     } 
    } 
}); 

Documenti: https://datatables.net/reference/option/ajax.dataSrc

Answer 2

Non utilizzare la funzione url del DataTable, rendono l'Ajax definirvi

$.getJSON('/transactions', function(response) { 
    $('#transactions').dataTable({ 
    processing: true, 
    data: response.data, 
    columns: [ 
     { data: "car"}, 
     { data: "card_number"}, 
     { data: "invoice"}, 
     { data: "status"} 
    ] 
    }); 
    window.someGlobalOrWhatever = response.balance 
}); 

Answer 3

Dal DataTable 1.10, si può utilizzare la funzione ajax.json(): https://datatables.net/reference/api/ajax.json() L'ho implementata nel codice di esempio qui sotto.

$(document).ready(function() { 
    $('#search-form').submit(function(e) { 
    e.preventDefault(); 
    var table = $('#location-table').DataTable({ 
     destroy: true, 
     ajax: "/locations.json", 
     columns: [ 
     { "data": "code" }, 
     { "data": "status" }, 
     { "data": "name" }, 
     { "data": "region" }, 
     { "data": "address" }, 
     { "data": "city" }, 
     { "data": "state" }, 
     { "data": "zip" }, 
     { "data": "phone_number" }, 
     ] 
    }) 
    table.on('xhr', function() { 
    var json = table.ajax.json(); 
    $('#totals').text(json.totals) 
    }); 
    }) 
}); 

NOTA per questo lavoro è necessario inizializzare la DataTable con $('#location-table').DataTable() e non $('#location-table').dataTable (la differenza è il capitalizzato D)