Large Tables Unresponsive

Large Tables Unresponsive

SpringsTeaSpringsTea Posts: 11Questions: 1Answers: 0

I'm a student intern right now, so a lot of the related posts on this issue are confusing me, so I thought I would just ask for a simplified version.

I'm dealing with rows with 100+ columns, but theres not a lot of data right now, the table is still in the KB's.
I changed the "iDisplayLength" to 10, but it's still loading everything in one page, which I assume is part of the problem.
The browser becomes completely unresponsive and crashes AFTER the data loads onto the page.

I used this page: http://www.datatables.net/examples/data_sources/server_side.html
practically verbatim.

$(document).ready(function(){ $('#myTable').dataTable({ "iDisplayLength": 10, "processing": true, "serverSide": true, "ajax": "ajax.php", "sServerMethod":"POST" }); });

Answers

  • RpiechuraRpiechura Posts: 98Questions: 3Answers: 14

    Are you saying that it is creating a table that shows 100 entries or that it is loading the data of 100 entries each time you create the table? If you're getting the data for 100 entries, than you'd likely be seeing 100 entries being drawn on the table as well. The point of server side processing is to delay getting the information until you need it, so if you only want 10 records to display, you should only be returning 10 records from the server.

  • SpringsTeaSpringsTea Posts: 11Questions: 1Answers: 0

    "Are you saying that it is creating a table that shows 100 entries or that it is loading the data of 100 entries each time you create the table?"

    Both?

    Im throwing the table a JSON string of the whole table,since it's not entirely massive.
    Thats what the example I used seemed to do, and it's pages work fine.

  • RpiechuraRpiechura Posts: 98Questions: 3Answers: 14

    Okay, I'm failing to see exactly what the problem is than other than the fact that obviously the browser is crashing. Is there a specific javascript error that you're getting that you were curious about or something? If you want to reduce the amount of information that is displayed, than cut back the amount of Json that is returned by the server.

  • SpringsTeaSpringsTea Posts: 11Questions: 1Answers: 0

    The browser is becoming unresponsive and crashing because the table is trying to display too much data at once. If I go to the page thats echoing out the JSON string the whole thing l loads in about a second without any issue. I figured if I could limit how many items per page the table was displaying that would be a good short term solution.

    To cut down on what the server is spitting out, wouldn't that mean the table would have to query based on page number and size? Is there an example page you can point me to on how that can be done?

  • RpiechuraRpiechura Posts: 98Questions: 3Answers: 14

    That's what the server-side processing example that you linked above is doing. It makes a request for information based on page number (iDisplayStart) and size (iDisplayLength). Both of those are in the request that gets sent to the server. If you want to tell the server to send back less data that is what you have to change so that your server knows how much to send back.

    You can try using deferLoading, an example can be found at http://www.datatables.net/examples/server_side/defer_loading.html. deferLoading tells the table to only draw the table elements when needed (IE when the data is returned). That may help if you think that it is exclusively because of the fact that there is too much data.

    I wonder if there isn't something else that's causing the issue though since I haven't seen the problem first hand. It'd help if you set up a live demo using either http://live.datatables.net/ or http://jsfiddle.net/. Or if you don't want to do that because it's too much effort, it'd be nice to at least see the debugger information (http://debug.datatables.net/) which would help track down errors. Without any of that I can only throw ideas out there.

  • SpringsTeaSpringsTea Posts: 11Questions: 1Answers: 0

    I can't really put up a demo because of sensitive data, but if you could help me understand this server side processing that would be great.

    I'm looking at the example I cited earlier and I don't see anywhere in the code where the page number and size are being sent to be used in a query. The server side looks like it's just sending the column names, table name and primary key.

  • RpiechuraRpiechura Posts: 98Questions: 3Answers: 14

    http://www.datatables.net/manual/server-side has all the information I'd be able to tell you about it. Basically you want to change the start and length to change page number and size. If you have 50 records and you say that the length should be 15, than a start of 15 would be page two, a start of 0 would be page one, ect. Same as if you said length 10 and start 20, you'd be on page 3. Keep in mind those are sent TO the server, your server logic should then figure that out and adjust the size of the data accordingly.

  • SpringsTeaSpringsTea Posts: 11Questions: 1Answers: 0

    Ok, so what are the length and number stored under? I'm guessing $_GET['???'] ?

  • allanallan Posts: 55,114Questions: 1Answers: 8,654 Site admin

    If you send the data as GET parameters, then yes. If you sent them as POST then in PHP there will be available under $_POST. The manual page @Rpiechura linked you to has all the parameters fully defined.

    Beyond that, we'd need a link to your page so we can profile it and see what is going wrong.

    Allan

  • SpringsTeaSpringsTea Posts: 11Questions: 1Answers: 0

    Ok so I'm starting to understand what's going on here, and I might just be missing something obvious. So like the example I'm using ssp.class.php which I found here: https://github.com/DataTables/DataTables/blob/master/examples/server_side/scripts/ssp.class.php

    So I think I might be doing things in the wrong order. I've got a controller named indexload.php creating the table and setting the headers, and the data table is being created like so:

    $(document).ready(function(){
    $('#myTable').dataTable({
    "processing": true,
    "serverSide": true,
    "ajax": "ajax.php",
    "sServerMethod":"POST",
    'iDisplayLength': 5

        });
    });
    

    So the table is grabbing data from ajax.php which is passing back to the table after pushing to ssp.class:

    echo json_encode(
    SSP::simple( $_POST, $sql_details, $table, $primaryKey, $columns )
    );

    The problem I'm running into is $_POST is empty when ajax.php goes to call ssp.class.

  • SpringsTeaSpringsTea Posts: 11Questions: 1Answers: 0
    edited June 2014

    Please, I'm so close, I just dont understand what isnt working.

    I can see in my headers that my data source is getting the Form Data - start and length along with all the column data. I pass $_POST to my class like in the above code, and read it in as $request.

    So in my code, $request["start"] is empty

This discussion has been closed.