Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

dan3460's avatar

Datatable draw not updating post variable

I'm using Yajra Datatables, I have a select that returns 0,1 or 2 and depending on that the datatable is populated. My problem is when changing the selection the "type" variable still the one on the first selection. In other words the type still 0 regardless of what was selected. The alert that i have in the change, shows the selection chaging, but the draw has the old data:

    $(document).ready(function(){
    var batchesTable = $('#batches').DataTable({
        processing: true,
        serverSide: true,
        ajax: {
            url: '/getBatches',
            type: 'post',
            data: {
                _token: "{{csrf_token()}}",
                type: $("#type").val()
            }
        },
        columns:[
            {data: 'id', name: 'id'},
            {data: 'name', name: 'name'},
            {data: 'debit', name: 'debit'},
            {data: 'credit', name: 'credit'},
            {data: 'updated', name: 'updated'},
            {data: 'posting', name: 'posting'},
            {data: 'action', name: 'action'}
        ]
    });

    $("#type").change(function(){
        alert($("#type").val());
        batchesTable.draw();
    });
})
0 likes
6 replies
dan3460's avatar

Here is. I thought that the value may not be passing correctly so i selected a one of them and returns the correct data.

<div class="form-group">
    <select class="form-control" name="type" id="type">
        <option value=0>Pending</option>
        <option value=1 selected>Posted</option>
        <option value=2>All</option>
    </select>
</div>
bobbybouwmann's avatar

@dan3460 You can't get the selected value using val() on the select itself. You need to get it from the selected option instead. So something like this

$("#type").change(function(){
    alert($(this).children("option:selected").val());
});

Let me know if this works for you!

dan3460's avatar

@bobbybouwmann made the following change at the data portion of the ajax call:

data: {
    _token: "{{csrf_token()}}",
    type: $("#type").children("option:selected").val()
}

It didn't changed the result. It seems to me that when the table is declared is burned in memory and the function draw() only calls for that in memory to reprocess. It doesn't read again the variables. I place the same question in the DataTables web site,

dan3460's avatar

After several hours of working on this thing i think i have the answer, Indeed it looks like that way that i was constructing the ajax call is the static method https://datatables.net/reference/option/ajax.data. To be able to manipulate the data section of the ajax function has to be declared with a closure in this way:

ajax: {
    url: '/getBatches',
    type: 'post',
    data: function(d){
        d._token = "{{csrf_token()}}",
        d.type = $("#type").val()
    }
},

Thanks

Please or to participate in this conversation.