Блог

В приложении laravel 8 / jQuery v3.6.0 у меня есть таблицы данных (1.11.1), которые считывают данные с сервера по страницам, и я устанавливаю свойства bServerSide = true и bProcessing = true и bSortable = true для любого столбца, который я хочу сделать сортируемым :

 <script src="{{ asset('js/plugins/datatables/jquery.dataTables.min.js') }}"></script>
<script src="{{ asset('js/plugins/datatables-bs5/js/dataTables.bootstrap5.min.js') }}"></script>
...
<!-- Page JS Code -->
<script src="{{ asset('js/pages/tables_datatables.js') }}"></script>


<script>
    initItems()

    function initItems() {
        var url = "{!!route('ItemsGetFilter')!!}";
        oTable = $('.js-dataTable-full').dataTable({
            "bServerSide": true,
            "sAjaxSource": url,

            "bProcessing": true,
            "aoColumns": [
                {
                    "mData": 'id',
                    "bSortable": true
                },
                {
                    "sWidth": "30%",
                    "mData": 'title',
                    "bSortable": true
                },
                {
                    "sWidth": "20%",
                    "mData": 'active_label',
                    "bSortable": true
                },
                {
                    "sWidth": "20%",
                    "mData": 'created_at_formatted',
                    "bSortable": true
                },

                {
                    "mData": null,
                    "bSortable": false,
                    "mRender": function (data, type, full) {
                        console.log('data::')
                        console.log(data)

                        return '<div>n
        <a class="btn btn-sm btn-success btn-icon m-2" href="'   data['edit_url']   '"  title="Edit item"><i class="fas fa-edit icon-nm"></i></a>n
        <a class="btn btn-sm btn-danger btn-icon m-2" href="javascript:deleteItem('   data.id   ')"  title="Удалить ярлык"><i class="fas fa-trash-alt icon-nm mb-1 "></i></a>n
    </div>';
                    }

                }]
        });
    } // function initItems() {

    function loadItems() {
        $('.js-dataTable-full').DataTable().clear();
        $('.js-dataTable-full').DataTable().ajax.reload();
    }
</script>
 

В сетке данных заголовка страницы любой столбец имеет сортируемые значки, но когда я нажимаю на них, данные перезагружаются, но не сортируются по выбранному столбцу
, и, проверяя журналы sql, я вижу строки, подобные :

 SELECT *
FROM `items`
ORDER BY `items`.`id` desc limit 10 offset 0
 

Как сделать сортируемыми мои данные, загруженные с сервера?

Заранее спасибо!