Laravel Datatable sort for data from Ajax call

Hello, I need a help, some advice to orientated

I have some data on my page, the best way (oriented on design) is using a table structure

 smth like this

    <table>
        <thead>
            <th><td>.Name</td></th>
            <th><td>...</td></th>
            <th><td>...</td></th>
        </thead>
        <tbody>
                <tr><td>...</td></tr>
            <tr><td>...</td></tr>
            <tr><td>...</td></tr>
        </tbody>
    </table>

Also, I have some load button

    <div> Load More </div>

When I click on it I get the next data's that I need to show from my table

I implement datatables, but when I click on datatbles sort after clicking "Load More" button , I loose data that I get from my ajax call.

What I can do? At this moment, I have only one idea, to write some custom order...

but the perfect way I think is datatable using... So I need to find the best way to solve this problem... Please help me to find some good decision.

jlrdw

8 years ago

Level 75

Have you read over this page on server side processing and order[i][column] https://datatables.net/manual/server-side

Lola

8 years ago

Level 1

it's my test ajax

$('#users-table').DataTable({
            processing: true,
            serverSide: true,
            ajax: '{{ route('orderdata')}}',
            columns: [
                { data: 'name', name: 'name' },
                { data: 'price', name: 'price' },
                { data: 'currency', name: 'currency' },
                { data: 'description', name: 'description' }
            ]
        });

And i have smth like this

$(".loadMoreTools").on("click",function () {
            $.ajax({
                url : '{{ route("tooldata") }}',
                method : "POST",
                data : {count:count, _token:"{{csrf_token()}}"},
                dataType : "json",
                success : function (data)
                {
                   
                        $('#load-data').append(data['data']);
                     
                }
            });
        })

Then when I try to order I lost my loaded data.

what I do wrong? I read the doc , but I'm not sure.... what is my bug..

I try to write smth liek this

$(".loadMoreTools").on("click",function () { $('#load-table').DataTable({ processing: true, serverSide: true, ajax: '{{ route('tooldata')}}', columns: [ { data: 'name', name: 'name' }, { data: 'price', name: 'price' }, { data: 'currency', name: 'currency' }, { data: 'description', name: 'description' } ] });

}

but it's not right...

Please or to participate in this conversation.