Question

I have a encountered a weird problem with JQuery datatables; I have these on a number of pages on my site, and they are working perfectly, except when the data exceeds some seemingly arbitrary size. In one instance this is exactly 798 rows (with two columns), another, which has nine columns, won’t display anything over around 500 rows. I am figuring this is something to do with the overall size of the data. Looking this up on Google people are saying there can be a problem with very large datasets, but these always seem to refer to rows in the millions; the most I have is just over 16000. Surely this shouldn’t cause an issue?

Basically if I try to return more rows than it likes, it does nothing; no errors, just doesn’t display any data and locks up IE. Is there a setting somewhere I have missed that is causing this?

Thanks

Answer 1

I ended up using Server Side processing to handle the data loading:

<script type="text/javascript">
$(document).ready(function() {
    //http://www.datatables.net
    $('#userTable').dataTable({
        "sPaginationType": "full_numbers",
        "bJQueryUI": false,
        "bAutoWidth": false,
        "bLengthChange": false,
        "bProcessing": true,
        "bServerSide": true,
        "sAjaxSource": "/Project/GetDataTables2",
        "fnServerData": function(url, data, callback) {
            $.ajax({
                "url": url,
                "data": data,
                "success": callback,
                "contentType": "application/x-www-form-urlencoded; charset=utf-8",
                "dataType": "json",
                "type": "POST",
                "cache": false,
                "error": function() {
                    alert("DataTables warning: JSON data from server failed to load or be parsed. " +
                    "This is most likely to be caused by a JSON formatting error.");
                }
            });
        },
        "aoColumns": [
            { "bSortable": true },
            { "bSortable": true }
        ]
    });
});                    
</script>

This worked perfectly and loaded quickly since I am only loading 10 or so at a time.