I have more than 10000 records in my datatable i want to server side processing with scrooling.

suvarna_krishna

I have 10000 records in database table i have returns in JSON ant catch on datatable tool in jquery with ajax how can i use scrooling in datatable in server side any one help me?

allan

The Scroller extension could be used if you want the display to look like one large scrolling table.

Allan

suvarna_krishna

allan i need server side processing datatable with scrolling .i refered your link
http://www.cscc.edu/_resources/app-data/datatables/extensions/scroller/examples/server-side_processing.html
but my data is not binding data comes from JSON.my project in .net.I have share with you the code please giv me idea where i am wrong.

suvarna_krishna

Site Id	Site Name

suvarna_krishna

var tableSelectedSites = function () {

return $('#SelectedSitesTable').dataTable({

    "oLanguage": {
        "sZeroRecords": "No records to display",

    },
    "aoColumns": [

                 { "sWidth": "10em", "bSortable": false },
                 { "sWidth": "10em", "bSortable": false }

    ],

    "bProcessing": true,
    "bServerSide": true,
    "bStateSave": true,
   // ajax:           '/api/data',
    scrollY:        200,
    deferRender:    true,
    scroller:       true,
    "binfo": true,
    "bLengthChange": false,
    "bAutoWidth": false,
    "iDisplayLength": 100000,
    "bDestroy": true,
    "bDeferRender": true,
    "bFilter": false,
    "bSort": true,
    "sPaginationType": "bs_normal",
    "sAjaxSource": "../HelperWebMethods.aspx/GetSelectedSites",
    "fnServerData": function (sSource, aoData, fnCallback) {
        var data = "{ ";
        for (var i = 0; i < aoData.length; i++) {
            if (aoData[i].name == 'iDisplayLength') {
                aoData.push({ "name": "PageSize", "value": 100000 });
            }
            if (aoData[i].name == 'iDisplayStart') {
                aoData.push({ "name": "PageNumber", "value": 1 });
            }
            data += aoData[i].name + ": ";
            data += "'" + aoData[i].value + "'";

            if (i != (aoData.length - 1))
                data += ", ";
        }
        data += " }";

        $.ajax({
            type: "POST",
            url: sSource,
            data: data,
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (msg) {
                    if (msg.d != null) {
                    var json = jQuery.parseJSON(msg.d);
                    fnCallback(json); 
                    $("#SelectedSitesTable").show();

                }
            }
        });

    }

});

}

suvarna_krishna

                              <table id="SelectedSitesTable" class="display nowrap">
                                 <thead>
                                     <tr>
                                         <th>Site  Id</th>
                                         <th>Site    Name</th>
                                     </tr>
                                 </thead>
                                 <tbody>
                                 </tbody>
                             </table>

suvarna_krishna

I want like this
http://www.cscc.edu/_resources/app-data/datatables/extensions/scroller/examples/server-side_processing.html

allan

I would need a link to the actual page, not just the code please.

Allan

suvarna_krishna

Bootstrap Pop over is supported server side tabletools with scrolling?