CODEWITHSUNDEEP
jquerydatatable
b85411
b85411

Reputation: 10000

Datatables.net for large data sets

I'm reading http://www.datatables.net/examples/data_sources/server_side.html and their examples but this is seriously tough to follow. Even https://datatables.net/manual/server-side is light on the examples.

Before I go down this path so far that I can't turn back, can anyone who has used Datatables confirm the following for me:

  1. I may end up having a large dataset with thousands of records; can I make it so initially only the first, say, 10 records are loaded. And then if the user hits the "Next page" button, records 11-20 are shown, and if they hit "Next page" again, 21-30 are shown, and so on? Loaded from the database (through a ajax/webservice) each time so its quick for the user.

  2. Can I make it so the search bar searches through the entire dataset from the database? There's probably about 3 columns I'd need to be able to filter on (like username, email address, postal address).

If I can do both of these things, then Datatables can work for me. So if anyone who has experience with it can share their experience in regards to the above questions that would be great. Thanks.

Upvotes: 0

Views: 4072

Answers (1)

jwhazel
jwhazel

Reputation: 984

To answer both 1 and 2 at the same time: yes, this is exactly how the server side functionality works and it's pretty easy to implement. An object is sent to the server side component with information about what to search for and how many to return (equal to the number of elements you specify on a page at a time) and the response is a JSON object of only enough data to fit in one page. You simply set the following options when you create your datable

"serverSide": true,
"ajax": "yourscript.php"

Check out the sample they offer here: http://www.datatables.net/examples/data_sources/server_side.html Pull up chrome inspector/firebug and watch the network tab. You can see the payload being sent back and forth every time you page and search (datatables takes care of constructing this for you but it gives you a little bit of idea how exactly it works). On that same page you can see in the tabs the javascript that used to setup the datatable client side, then a php script thats used to setup the server side. For some reason the second server side script doesn't appear to be on that page but you can find it here: https://github.com/DataTables/DataTables/blob/master/examples/server_side/scripts/ssp.class.php

EDIT 1: to change the info text add this to your options:

language: {
        "info": "page _PAGE_ of _PAGES_"
    }

Upvotes: 1

Related Questions