Getting requested unknown parameter error even though initialised properly

Getting requested unknown parameter error even though initialised properly

kevinjtkevinjt Posts: 10Questions: 1Answers: 0

I am using DataTables 1.11.3 and I was trying to initialise DataTable programmatically. This is the structure:

$('#table_a'+i).DataTable({
    language: {
        url: "{{ asset('demo1/plugins/custom/datatables/dataTables.id.json') }}"
    },
    "dom": "ltip",
    "pageLength" : 10,
    'lengthMenu': [[10, 25, 50, -1], [10, 25, 50, 'All']],
    "colReorder": true,
    'processing': true,
    "fnInitComplete":function(){
        $("#table_a"+i).show();
    },
    // 'serverSide': true,
    // 'stateSave': true,
    'select': {
        'style': 'multi+shift'
    },
    'serverMethod': 'post',
    'ajax': {
        'url':"localhost:8000/prgl_search",
        'data': function(data){
            data._token = "{{ csrf_token() }}";
            data.parent = '{{ $modes->first()->NamaLaporanParent }}';
            data.mode = $('#tab_'+i).attr('search-mode');
            data.date1 = $('#tanggal_1').val().split("/")[2]+'-'+$('#tanggal_1').val().split("/")[1]+'-'+$('#tanggal_1').val().split("/")[0];
            data.date2 = $('#tanggal_2').val().split("/")[2]+'-'+$('#tanggal_2').val().split("/")[1]+'-'+$('#tanggal_2').val().split("/")[0];
        }
    },
    'columns': data.columns[i-1]
});

where data.columns[i-1] contain:
[{"data": "KodeBarang", "title": "Kode"},
{"data": "NamaBarang", "title": "Nama"},
{"data": "KodeProduk", "title": "Produk"},
{"data": "SaldoAkhir", "render": "DataTable.render.number(' . ', ', ', 2)", "title": "Saldo"},
{"data": "Keterangan", "title": "Keterangan"}]

i is index because this code is in a loop to initialise multiple DataTables. After initialisation, the ajax function is automatically called, and it successfully returned with this record:
[{"KodeBarang":"P0010002","NamaBarang":"B1","KodeProduk":"P001","SaldoAkhir":"16150.00000","Keterangan":""},{"KodeBarang":"P0010003","NamaBarang":"B2","KodeProduk":"P001","SaldoAkhir":"0.00000","Keterangan":""},{"KodeBarang":"P0010005","NamaBarang":"TEST1","KodeProduk":"P001","SaldoAkhir":"0.00000","Keterangan":""},{"KodeBarang":"P0010013","NamaBarang":"TES2","KodeProduk":"P001","SaldoAkhir":"0.00000","Keterangan":""}]

However, shortly afterwards I got the warning: Requested unknown parameter 'SaldoAkhir' for row 0, column 3. I already declared the column 3 data to be 'SaldoAkhir' and the record returned from the ajax call is also in the correct order. Is there something that I have been doing wrong?

Thank you

Replies

  • kthorngrenkthorngren Posts: 21,205Questions: 26Answers: 4,927

    You have this:

    'columns': data.columns[i-1]
    

    Where is data defined? You columns need to be defined before initializing Datatables. See this FAQ and this example:
    http://live.datatables.net/huyexejo/1/edit

    Kevin

  • kevinjtkevinjt Posts: 10Questions: 1Answers: 0

    So this code is inside ajax call which looks like this:

    $.ajax({
        ...
        success: function(data){
            for (let i = 1; i <= 3; i++) {
                if(...) {
                    if(...){
                        if(typeof(data.columns[i-1]) != "undefined" && typeof(data.columns[i-1]) !== null){
                            $('#table_a'+i).DataTable({
                                language: {
                                    url: "{{ asset('demo1/plugins/custom/datatables/dataTables.id.json') }}"
                                },
                                "dom": "ltip",
                                "pageLength" : 10,
                                'lengthMenu': [[10, 25, 50, -1], [10, 25, 50, 'All']],
                                "colReorder": true,
                                'processing': true,
                                "fnInitComplete":function(){
                                    $("#table_a"+i).show();
                                },
                                // 'serverSide': true,
                                // 'stateSave': true,
                                'select': {
                                    'style': 'multi+shift'
                                },
                                'serverMethod': 'post',
                                'ajax': {
                                    'url':"localhost:8000/prgl_search",
                                    'data': function(data){
                                        data._token = "...";
                                        data.parent = '...';
                                        data.mode = $('#tab_'+i).attr('search-mode');
                                        data.date1 = $('#tanggal_1').val().split("/")[2]+'-'+$('#tanggal_1').val().split("/")[1]+'-'+$('#tanggal_1').val().split("/")[0];
                                        data.date2 = $('#tanggal_2').val().split("/")[2]+'-'+$('#tanggal_2').val().split("/")[1]+'-'+$('#tanggal_2').val().split("/")[0];
                                    }
                                },
                                'columns': data.columns[i-1]
                            });
                        }
                    }
                }
                else break;
            }
        },
        ...
    });
    

    The data.columns is an array, so I loop through the array to initialise DataTable.

  • allanallan Posts: 63,281Questions: 1Answers: 10,425 Site admin

    Can you use the debugger to give me a trace please - click the Upload button and then let me know what the debug code is.

    Thanks,
    Allan

  • kevinjtkevinjt Posts: 10Questions: 1Answers: 0

    Hello,

    I found the solution. The render returned from the server is the one causing problem because it uses double quote. After I removed them and add the render on the Javascript, it works now.

    Thank you

  • allanallan Posts: 63,281Questions: 1Answers: 10,425 Site admin

    Awesome - thanks for the update. Great to hear you got it working.

    Allan

Sign In or Register to comment.