0

let dataSeta = {"error": true,"message": "Data Pengiriman tidak ditemukan","data": null};

let pengiriman = $('#pengiriman-data').DataTable({
        responsive: true,
        data: dataSeta,
        columnDefs: [{
            searchable: false,
            orderable: false,
            targets: 0
        }],
        columns: [{
            data: "id_mon",
            defaultContent: ''
        }, {
            data: "kodejalan",
            defaultContent: ''
        }, {
            data: "nopol",
            defaultContent: ''
        }, {
            data: "supir",
            defaultContent: ''
        }, {
            data: "pelanggan",
            defaultContent: ''
        }, {
            data: "start",
            defaultContent: ''
        }, {
            data: "end",
            defaultContent: ''
        }, {
            data: "status",
            defaultContent: ''
        }, {
            data: "tanggal",
            defaultContent: ''
        }, {
            data: "action",
            defaultContent: ''
        }],
        "lengthChange": true,
        "lengthMenu": [[5, 10, 25, 50, 100], [5, 10, 25, 50, 100]],
        "paging":   true,
        "ordering": true,
        "info": true
      });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.24/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.24/js/dataTables.bootstrap4.min.js"></script>
<table loading="lazy" id="pengiriman-data" class="table table-bordered table-striped">
<thead>
  <tr>
    <th>ID</th>
    <th>Surat Jalan</th>
    <th>Mobil</th>
    <th>Supir</th>
    <th>Pelanggan</th>
    <th>Start</th>
    <th>End</th>
    <th>Status</th>
    <th>Tanggal</th>
    <th width="160">Aksi</th>
  </tr>
</thead>
</table>

I have code, the problem if records null display warning "DataTables warning: table id=pengiriman-data - true" datatables

let pengiriman = $('#pengiriman-data').DataTable({
        responsive: true,
        ajax: {
            "url":readUrl,
            "dataSrc": 'data'
        },
        columnDefs: [{
            searchable: false,
            orderable: false,
            targets: 0
        }],
        columns: [{
            data: "id_mon",
            defaultContent: ''
        }, {
            data: "kodejalan",
            defaultContent: ''
        }, {
            data: "nopol",
            defaultContent: ''
        }, {
            data: "supir",
            defaultContent: ''
        }, {
            data: "pelanggan",
            defaultContent: ''
        }, {
            data: "start",
            defaultContent: ''
        }, {
            data: "end",
            defaultContent: ''
        }, {
            data: "status",
            defaultContent: ''
        }, {
            data: "tanggal",
            defaultContent: ''
        }, {
            data: "action",
            defaultContent: ''
        }],
        "lengthChange": true,
        "lengthMenu": [[5, 10, 25, 50, 100], [5, 10, 25, 50, 100]],
        "paging":   true,
        "ordering": true,
        "info": true
      });

JSON Record Data :

{
    "error": false,
    "message": "Data Pengiriman",
    "data": [
        {
            "id_mon": "6",
            "kodejalan": "SJ00004\/03\/21",
            "nopol": "",
            "supir": "Dodong Karim",
            "pelanggan": "PT. Zoruka Sharp",
            "start": "",
            "end": "<button type=\"button\" class=\"btn btn-sm btn-success btn-flat\" onclick=\"return dataMap(6)\">Show<\/button>",
            "status": "<span class=\"badge badge-info\">Created<\/span>",
            "tanggal": "2021-04-01 20:12:14",
            "action": "bbb"
        },
        {
            "id_mon": "7",
            "kodejalan": "SJ00005\/03\/21",
            "nopol": "",
            "supir": "Dadang Kipas",
            "pelanggan": "PT. Zaruko Store",
            "start": "",
            "end": "<button type=\"button\" class=\"btn btn-sm btn-success btn-flat\" onclick=\"return dataMap(7)\">Show<\/button>",
            "status": "<span class=\"badge badge-info\">Created<\/span>",
            "tanggal": "2021-04-01 20:12:14",
            "action": "aaa"
        }
    ]
}

JSON Record NULL Data :

{
    "error": true,
    "message": "Data Pengiriman tidak ditemukan",
    "data": null
}
4
  • I am not able to recreate your issue (I do not get any warnings). Can you provide a minimal reproducible example - for example, in a Fiddle, or similar? My code uses slightly different JSON - but the structures are the same as yours. Apr 1, 2021 at 14:00
  • Very minor point: searcable: false should be searchable: false. Apr 1, 2021 at 14:00
  • @andrewjames okay already change to searchable Apr 2, 2021 at 3:38
  • @andrewjames i already change code to defaultContent still warning in my laptop Apr 2, 2021 at 3:41

1 Answer 1

0

Okay finally this case solved :) I change JSON Result error to errData

{
    "errData": true,
    "message": "Data Pengiriman tidak ditemukan",
    "data": null
}

And JS Code with :

let pengiriman = $('#pengiriman-data').DataTable({
        responsive: true,
        ajax: {
            "url":readUrl,
            "dataSrc": function(data){
                if(data.data == null){
                    return [];
                } else {
                    return data.data;
                }
            }
        },
        columnDefs: [{
            searchable: false,
            orderable: false,
            targets: 0
        }],
        columns: [{
            defaultContent: '',
            data: 'id_mon'
        }, {
            defaultContent: '',
            data: 'kodejalan'
        }, {
            defaultContent: '',
            data: 'nopol'
        }, {
            defaultContent: '',
            data: 'supir'
        }, {
            defaultContent: '',
            data: 'pelanggan'
        }, {
            defaultContent: '',
            data: 'start'
        }, {
            defaultContent: '',
            data: 'end'
        }, {
            defaultContent: '',
            data: 'status'
        }, {
            defaultContent: '',
            data: 'tanggal'
        }, {
            defaultContent: '',
            data: 'action'
        }],
        "lengthChange": true,
        "lengthMenu": [[5, 10, 25, 50, 100], [5, 10, 25, 50, 100]],
        "paging":   true,
        "ordering": true,
        "info": true
      });

Read : My Question solved in this forum

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.