在 node.js 中使用数据表

Question

我正在尝试将 jquery Datatable 与 Node.js 一起使用。 这是我的代码 HTML

<button id="btnSearch" type="submit" class="btn btn-responsive"><i class="icon-search"></i>&nbsp;Search</button>

<div class="box-body table-responsive no-padding">
    <div id="tableContainer">
        <table class="table table-hover" id="dataTables1">
            <thead>
            <tr>
                <th class="text-left">base</th>
                <th class="text-left">base1</th>
            </tr>
            </thead>
            <tbody></tbody>
        </table>
    </div>
    <div class="text-center">
            <img id="loading-image" src="../dist/img/loading_spinner.gif" style="display: none;" />
    </div>
</div>

这里是脚本代码

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
    $("#btnSearch").click(function () {
        RefreshTable("#dataTables1");
    });

    function RefreshTable(tableId) {

        table = $(tableId).dataTable();
        table._fnClearTable(table.oSettings);
        table.fnDestroy();
        table.fnDraw(true);
        var table2 = $(tableId).dataTable({
            "bServerSide": true,
            "bProcessing": true,
            "responsive": true,
            "bAutoWidth": false,
            oLanguage: {
                sProcessing: "<img src='../dist/img/loading_spinner.gif'/>"
            },
            "aLengthMenu": [10, 30, 50, 100],
            "pageLength": 30,
            "sAjaxSource": 'http://127.0.0.1:3000/statistic?schemename=abc',
            "fnServerData": function (sSource, aoData, fnCallback) {
                $.ajax({
                    "dataType": 'json',
                    "type": "POST",
                    "url": sSource,
                    "data": aoData,
                    "success": fnCallback
                });
            },
            "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
            "sPaginationType": "full_numbers",//"full_numbers",
            "aoColumns": [
                { "sName": "base", "bSortable": false },//0
                { "sName": "base1", "bSortable": false }
            ]
        });
    }
</script>

这是我的代码服务器端节点 js

var async = require('async'),
    QueryBuilder = require('datatable');

var tableDefinition = {
    sTableName: 'Orgs'
};

var queryBuilder = new QueryBuilder(tableDefinition);

// requestQuery is normally provided by the DataTables AJAX call
var requestQuery = {
    iDisplayStart: 0,
    iDisplayLength: 5
};

// Build an object of SQL statements
var queries = queryBuilder.buildQuery(requestQuery);   

exports.test = function(req, res){
        console.log(req.query.schemename);

        userExport.getUserEdit(req.query.schemename, function(rows){
            res.json(queryBuilder.parseResponse(rows));
        })
    }

当我点击搜索按钮时，在服务器端我收到的方案名称是“abc”并获得了用户，但我无法将 json 响应到表中。在浏览器的选项卡控制台中，出现错误： jquery.dataTables.js:4108 Uncaught TypeError: Cannot read property 'length' of undefined, 任何人都可以帮助我摆脱这个错误或建议我解决这个问题的解决方案感谢冒险

Answer 1

将sAjaxDataProp: 'data' 添加到您的初始化参数中：

var table2 = $(tableId).dataTable({
  ...
  sAjaxDataProp: 'data',
  sAjaxSource: 'http://127.0.0.1:3000/statistic?schemename=abc',
  ...
})

原因：使用sAjaxSource 时，dataTables 1.9.x 期望数据格式为{ "aaData" : [...] }，这就是为什么您会收到未捕获的类型错误：无法读取未定义的属性“长度”。但是，node-datatable 将行导出为 { "data" : [...] }。