Jquery.Datatable.js花时间渲染记录

时间:2016-05-16 11:20:12

标签: javascript jquery asp.net-mvc

我有一个MVC应用程序,我从数据库中获取5000条记录,并在动作中以JSOn格式返回并呈现Jquery.DataTable.js版本1.9.0网格。应用程序没有延迟地返回数据,但是在网格中渲染需要时间。以下是代码

   $.ajax({
        url:   "http://locationhost/Mycontroller/myacton", type: "Get", contentType: "application/json; charset=utf-8",
        data: { 'param': param1, 'param2': param2,  },
        dataType: "json",

        success: function (data) {
            $('#DisableDiv').html("");
            var items = '';
            var rows = '';

                $('#divGrid').DataTable().fnClearTable();
                $('#divGrid').DataTable().fnDestroy();
                if (data.length > 0) {
                    $.each(data, function (i, item) {

                        rows = "<tr>........records......</tr>"

                        $('#divGrid tbody').append(rows);
                    });
                    table = $('#divGrid').DataTable({
                        "aoColumnDefs": [
                         {
                             'bSortable': false,
                             'aTargets': [0, 8],
                         }],
                        "aoColumns": [{ "bSortable": false }, null, null, null, null, null, { "sType": "currency" }, null, { "bSortable": false }],
                        "bPaginate": true,
                        "bInfo": true,
                        "bFilter": false,
                        "bLengthChange": true,
                        "sPaginationType": "full_numbers",
                        "iDisplayLength": 10
                    });
                    table.fnSort([[7, 'desc']]);
                }
                else {
                    $('#DisableDiv').html("No data available.");
                    $("#btnDownload").attr("href", "#");
                }


            }
        },
        error: function (data) {
            $('#DisableDiv').html("");
        }
    });

1 个答案:

答案 0 :(得分:0)

服务器端处理是最好的,因为当您渲染大量没有数据集记录客户端时 如果你想看到它请慢一点,请在这种情况下按照以下链接

http://datatables.net/usage/server-side

示例(http://datatables.net/release-datatables/examples/data_sources/server_side.html)。