Данные не отображаются в таблицах данных

Question

У меня есть данные JSON, как это

[{
    "Lembar_BPJS_Kesehatan": "2",
    "Total_BPJS_Kesehatan": "56000",
    "Lembar_PDAM_TIRTA_BULIAN_TB_TINGGI_SUMUT": "5",
    "Total_PDAM_TIRTA_BULIAN_TB_TINGGI_SUMUT": "398300",
    "Lembar_PDAM_TIRTA_UMBU_KAB__NIAS": "1",
    "Total_PDAM_TIRTA_UMBU_KAB__NIAS": "23089",
    "Lembar_PDAM_TIRTAULI_KOTA_PEMATANGSIANTAR": "319",
    "Total_PDAM_TIRTAULI_KOTA_PEMATANGSIANTAR": "20434870",
    "Lembar_PLN_Postpaid": "103",
    "Total_PLN_Postpaid": "10272775",
    "Lembar_Pulsa_Listrik": "30",
    "Total_Pulsa_Listrik": "1905000",
    "Lembar_Telkom": "4",
    "Total_Telkom": "1716000",
    "tgl_dari": "2018-04-20",
    "tgl_sampai": "2018-04-20"
}]

Я хочу отобразить таблицы данных с моим кодом, это:

  $(document).ready(function(){
                var dataku = [];
                $.ajax({
                    url: base_url+'laporan/load_trx_per_tgl_bukopin',
                    dataType: 'json', 
                    success: function(data){
                        dataku = jQuery.parseJSON(JSON.stringify(data));;
                        console.log(dataku);                            
                }
                });

                $('#tabelTransaksiPerTglBukopin').DataTable( {
                    'dom': 'Zlfrtip',
                    'scrollX': true,
                    'data': dataku
                });
            });

но не могу отобразить в моих таблицах данных. Это мой взгляд:

Answer 1

Другой способ - использовать AJAX в качестве источника данных в Datatables напрямую:

$('#tabelTransaksiPerTglBukopin').DataTable({
  ajax: {
    url: base_url + 'laporan/load_trx_per_tgl_bukopin',
    dataSrc: ''
  },
  'dom': 'Zlfrtip',
  'scrollX': true,
  'columns': [{
      "data": "Lembar_BPJS_Kesehatan"
    },
    {
      "data": "Total_BPJS_Kesehatan"
    },
    {
      "data": "Lembar_PDAM_TIRTA_BULIAN_TB_TINGGI_SUMUT"
    },
    {
      "data": "Total_PDAM_TIRTA_BULIAN_TB_TINGGI_SUMUT"
    },
    {
      "data": "Lembar_PDAM_TIRTA_UMBU_KAB__NIAS"
    },
    {
      "data": "Lembar_PDAM_TIRTAULI_KOTA_PEMATANGSIANTAR"
    },
    {
      "data": "Total_PDAM_TIRTAULI_KOTA_PEMATANGSIANTAR"
    },
    {
      "data": "Lembar_PLN_Postpaid"
    },
    {
      "data": "Total_PLN_Postpaid"
    },
    {
      "data": "Lembar_Pulsa_Listrik"
    },
    {
      "data": "Total_Pulsa_Listrik"
    },
    {
      "data": "Lembar_Telkom"
    },
    {
      "data": "Total_Telkom"
    },
    {
      "data": "tgl_dari"
    },
    {
      "data": "tgl_sampai"
    }
  ]
});

Учитывая, что результат JSON вашего AJAX имеет следующий формат:

[{
    "Lembar_BPJS_Kesehatan": "2",
    "Total_BPJS_Kesehatan": "56000",
    "Lembar_PDAM_TIRTA_BULIAN_TB_TINGGI_SUMUT": "5",
    "Total_PDAM_TIRTA_BULIAN_TB_TINGGI_SUMUT": "398300",
    "Lembar_PDAM_TIRTA_UMBU_KAB__NIAS": "1",
    "Total_PDAM_TIRTA_UMBU_KAB__NIAS": "23089",
    "Lembar_PDAM_TIRTAULI_KOTA_PEMATANGSIANTAR": "319",
    "Total_PDAM_TIRTAULI_KOTA_PEMATANGSIANTAR": "20434870",
    "Lembar_PLN_Postpaid": "103",
    "Total_PLN_Postpaid": "10272775",
    "Lembar_Pulsa_Listrik": "30",
    "Total_Pulsa_Listrik": "1905000",
    "Lembar_Telkom": "4",
    "Total_Telkom": "1716000",
    "tgl_dari": "2018-04-20",
    "tgl_sampai": "2018-04-20"
}]

Answer 2

попробуйте

$(document).ready(function(){
  var dataku = [];
  $.ajax({
    url: base_url+'laporan/load_trx_per_tgl_bukopin',
    dataType: 'json', 
    success: function(data){
      dataku = jQuery.parseJSON(JSON.stringify(data));;
      console.log(dataku);
      $('#tabelTransaksiPerTglBukopin').DataTable( {
        'dom': 'Zlfrtip',
        'scrollX': true,
        'data': dataku
      });  
      }
    });      
 });

AJAX расшифровывается как асинхронный JavaScript и XML. это означает, что данные, которые вы получаете, требуют времени, пока они не будут готовы к использованию. если вы переместите вашу таблицу данных в обратный вызов успеха, убедитесь, что dataku доступен, когда вы ее используете.

надеюсь, это поможет