Question

我使用fnServerData从服务器端获取数据，并希望将数据设置为列。答复如下。

{"sEcho":"1","iTotalRecords":3,"iTotalDisplayRecords":3,"aaData":[["100007_pgsqldb1","0 bytes",null,"06 Hr 46 Min","2790"],["100007-mssqldb1","0 bytes",null,"06 Hr 46 Min","2789"],["100007-mysqldb1","0 bytes",null,"06 Hr 46 Min","2784"]]}

我的数据表定义如下。

$('#databases').dataTable({
    "bFilter": false,
    "bSort" : false,
    "bAutoWidth": false,
    "bProcessing": true,
    "bServerSide": true,
    "sPaginationType": "full_numbers",
    "sDom": 'frtlpi',
    "sAjaxSource": searchUrl,
    "fnServerData": function(sSource, aoData, fnCallback) {
        $.getJSON(sSource, aoData, function(json) {
            fnCallback(json);
        });
    },
    "aoColumns": aoColumns // How set response data here ???
});

服务器响应aaData中有5个值，但只想显示前4个值。

Answer 1

使用aoColumns属性准确映射您要使用的属性。

    $('#databases').dataTable({
            "bFilter": false,
            "bSort" : false,
            "bAutoWidth": false,
            "bProcessing": true,
            "bServerSide": true,
            "sPaginationType": "full_numbers",
            "sDom": 'frtlpi',
            "sAjaxSource": searchUrl,
            "fnServerData": function(sSource, aoData, fnCallback) {
                $.getJSON(sSource, aoData, function(json) {
                    fnCallback(json);
                });
            },
            "aoColumnDefs": [
                {"sWidth": "100px", "bSortable": true, "aTargets": [0]},
                {"sWidth": "100px", "bSortable": true, "aTargets": [1]},
                {"sWidth": "100px", "bSortable": true, "aTargets": [2]},
                {"sWidth": "100px", "bSortable": true, "aTargets": [3]}
            ],
            "aoColumns": [
                {
                    mDataProp: [0],
                    "sClass": "left"
                },
                {
                    mDataProp: [1],
                    "sClass": "left"
                },
                {
                    mDataProp: [2],
                    "sClass": "left"
                },
                {
                    mDataProp: [3],
                    "sClass": "left"
                }
            ]
        });

HTML：

<table id="databases">
    <thead>
    <tr>
        <th>Header1</th>
        <th>Header2</th>
        <th>Header3</th>
        <th>Header4</th>        
    </tr>
    </thead>
    <tbody>
    </tbody>
</table>

详情请见http://legacy.datatables.net/usage/columns

数据表 - 使用fnServerData设置aoColumns

1 个答案: