Checkbox selection - SortColumn is now empty on server side

VascoOliveira

I have a Datatable that has server side paging/sorting, etc.
Everything was working as expected.

I then used this guideto allow row selection by the use of a checkbox.
The Select capabilities are provided with the Select plugin.

When adding the checkbox selection, the table does not even load, as i now get an error on the server side due to the fact that the SortColumn is now empty. Sort column is obtained by "request.Columns[0].Name".

The code is:

const table = $("#example").DataTable({
                processing: true, // for show progress bar
                serverSide: true, // for process server side
                orderMulti: false, // for disable multiple column at once,
                searching: true,
                ordering: true,
                paging: true,
                ajax: {
                    url: "https://jsonplaceholder.typicode.com/users",
                    type: "GET",
                    datatype: "json",
                    dataSrc: ""
                },
                columns: [
                    {
                        data: null,
                        defaultContent: '',
                        orderable: false
                    },                  
                    {
                        data: "id",
                        name: "id",
                        autoWidth: true
                    },
                    {
                        data: "name",
                        name: "name",
                        autoWidth: true
                    },
                    {
                        data: "username",
                        name: "username",
                        autoWidth: true
                    }                   
                ],
                columnDefs: [ {
                    orderable: false,
                    className: 'select-checkbox',
                    targets:   0
                } ],  
                scrollY: "300px",
                select: {
                    style:    'os',
                    selector: 'td:first-child'
                },
                order: [[1, 'asc']],
                oLanguage: {
                    sSearch: "Search:",
                    select: {
                        rows: " - %d rows selected"
                    }
                }
            });

I created an online example here, using the exact same code, and the exact same jquery/datatable versions, but here it works as expected, i assume because in this case, there is no server side paging.

Any ideas why the SortColumn is now empty?

colin

Hi @VascoOliveira ,

With serverSide enabled, the Ajax request sends the configured columns - in your case, it's sending this:

columns[0][data]:
columns[0][name]:
columns[0][searchable]:true
columns[0][orderable]:false
columns[0][search][value]:
columns[0][search][regex]:false
columns[1][data]:id
columns[1][name]:id
columns[1][searchable]:true
columns[1][orderable]:true
columns[1][search][value]:
columns[1][search][regex]:false
columns[2][data]:name
columns[2][name]:name
columns[2][searchable]:true
columns[2][orderable]:true
columns[2][search][value]:
columns[2][search][regex]:false
columns[3][data]:username
columns[3][name]:username
columns[3][searchable]:true
columns[3][orderable]:true
columns[3][search][value]:
columns[3][search][regex]:false

Because you've now got the extra column in that request, the server script needs to handle it appropriately.

Cheers,

Colin

VascoOliveira

Perfect, it makes sense.

Thank you very much for the quick response.