DataTables Slow to load (large table workaround?)

DataTables Slow to load (large table workaround?)

veranopageveranopage Posts: 24Questions: 0Answers: 0
edited November 2012 in General
I am loading a cSV file from the jquerycsvtotable mod and the csv file is approx 700KB. I am using IE7 and it refused to load the table, is there any work around to large tables ?

Replies

  • allanallan Posts: 63,534Questions: 1Answers: 10,475 Site admin
    See http://datatables.net/faqs#speed
  • veranopageveranopage Posts: 24Questions: 0Answers: 0
    This is what I have so far. But I am getting an error message when I put in the lines
    "bDeferRender": true
    bDeferRender: true
    Please note I havent added any addtional code

    Thanks to anyone who can help!

    [code]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">





    DataTables example

    @import "../../media/css/demo_page.css";
    @import "../../media/css/jquery.dataTables.css";





    $(function() {
    $('#CSVTable').CSVToTable('data/total115.csv', {
    loadingImage: 'res/theme/loading.gif',
    startLine: 1,
    tableClass: "dataTable",
    headers: ['header1', 'header2', 'header3']
    }).bind("loadComplete",function() {
    "bDeferRender": true
    bDeferRender: true
    $('#CSVTable').find('TABLE').dataTable({sortList:[[3,0],[9,0]], widgets: ['zebra']});
    $("#CSVTable .dataTable tr").each(function(i,row) {
    var column = (i>0)?"":" ";
    $(this).prepend(column);
    });
    $("input:checkbox.removeRow").bind("click", function(){
    $(this).closest("tr").remove();
    });
    });
    });





    DataTables base example


    Live example



    [/code]
  • veranopageveranopage Posts: 24Questions: 0Answers: 0
    Error is expected '.' on line 23, same line that the new code is on.
  • allanallan Posts: 63,534Questions: 1Answers: 10,475 Site admin
    This example shows how to use deferred rendering: http://datatables.net/release-datatables/examples/ajax/defer_render.html .

    What are the `sortList` and `widgets` initialisation parameter? DataTables doesn't pick them up unless you have plug-ins?

    Allan
  • veranopageveranopage Posts: 24Questions: 0Answers: 0
    only problem is im not using ajax
  • veranopageveranopage Posts: 24Questions: 0Answers: 0
    Does anyone know if the bDeferRender fix will work with the code I have?

    Thanks guys!
  • veranopageveranopage Posts: 24Questions: 0Answers: 0
    I see this http://datatables.net/dev/jquery.dataTables.delayedRendering.js , but I dont use json, i use csv, how can I tie this in? this is a 2 month long problem !
  • allanallan Posts: 63,534Questions: 1Answers: 10,475 Site admin
    It would be really rather helpful if you could link us to the page showing the problem so we aren't just guessing at solutions.

    I don't understand what sortList and widgets are in your initialisation and I don't see how you are using deferred rendering. I also don't see how you are adding data to the table - which you would need to do using fnAddData to make use of deferred rendering.

    > this is a 2 month long problem !

    You only posted it yesterday :-)
  • veranopageveranopage Posts: 24Questions: 0Answers: 0
    This is the updated code

    [code]

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">





    DataTables example

    @import "../../media/css/demo_page.css";
    @import "../../media/css/jquery.dataTables.css";






    $(function() {
    $('#CSVTable').CSVToTable('data/total115.csv', {
    loadingImage: 'res/theme/loading.gif',
    tableClass: "dataTable",
    headers: ['header1', 'header2']
    }).bind("loadComplete",function() {
    $("#CSVTable .dataTable tr").each(function(i,row) {
    var column = (i>0)?"":" ";
    $(this).prepend(column);
    });
    $("input:checkbox.removeRow").bind("click", function(){
    $(this).closest("tr").remove()
    $('#CSVTable').dataTable( {
    "bProcessing": true,
    "bDeferRender": true
    } );
    });
    });
    });





    DataTables base example


    Live example




    [/code]
  • veranopageveranopage Posts: 24Questions: 0Answers: 0
    Also, I am importing it via a CSV file.
  • veranopageveranopage Posts: 24Questions: 0Answers: 0
    And to answer your question Alan, there is not a page I can show this on as its a clientside application.
  • veranopageveranopage Posts: 24Questions: 0Answers: 0
    Also, as there might be alternative fixes for this, I am just wanting to convert an excel file for use with DataTables via clientside.
    Currently doing this with CSV but I imagine there may be other ways. So I am open to that.
  • veranopageveranopage Posts: 24Questions: 0Answers: 0
    is there anything more I can do, to help find a solution per this? Thanks guys!
  • veranopageveranopage Posts: 24Questions: 0Answers: 0
    How do I get this to work? Do I have to use fnAddData?
  • flarpyflarpy Posts: 47Questions: 0Answers: 0
    FYI, I am using datatables with up to 5000 records and it is fast. Have you considered converting your CSV to JSON which should be quick?
  • veranopageveranopage Posts: 24Questions: 0Answers: 0
    Thanks for your reply. How do I convert from excel to json? or csv to json? This is a clientside application.
  • flarpyflarpy Posts: 47Questions: 0Answers: 0
    Hi

    1. Write your own
    2. Google search reveals a few possibles including http://www.cparker15.com/code/utilities/csv-to-json/
    3. Get an elance.com or freelance.com account and get someone to do it for you, probably not more than USD50

    Good luck
  • veranopageveranopage Posts: 24Questions: 0Answers: 0
    Alan, any other ideas?
  • allanallan Posts: 63,534Questions: 1Answers: 10,475 Site admin
    As flarpy suggests, you need to convert from CSV to JSON - you are already converting from CSV to HTML so you aren't far away. Then when you have an array of data use fnAddData to add the data to the table (with deferred rendering enabled).

    It would be best if you could do the CSV -> JSON outside the browser as string manipulate is slow in old IE, but so it goes...

    Allan
This discussion has been closed.