Django - jQuery 数据表卡在加载中

Question

对不起，我对 Django 很陌生，并试图用一些从服务器返回的数据来加载一个 jQuery 数据表。返回的 json 格式很好。但是，数据未加载到表中，并且我在 firebug 控制台中收到以下错误：

TypeError: aData is undefined
for ( i=0 ; i<aData.length ; i++ ) {

此外，我尝试使用sAjaxDataProp 选项来调整aaData 的默认行为，但我不知道应该设置什么。无论如何，下面是所有内容的代码

jquery:

$(document).ready(function () {
    $('#rfctable').dataTable({
        "sAjaxDataProp": '', // I don't know if I need this or how to deal with it
        "ajax": 'http://127.0.0.1:8000/api/',
        "columns": [
            { "fields": "rfc_number"},
            { "fields": "rfc_title"},
            { "fields": "rfc_question"},
        ]

    });
});

html:

<table id="rfctable" class="display" cellspacing="0" width="100%">
    <thead>
    <tr>
        <th>Rfc Number</th>
        <th>RFC title</th>
        <th>RFC Questions</th>
    </tr>
    </thead>
</table>

从url返回的json：

[
    {
        "pk": 1,
        "model": "rfc.rfcdocument",
        "fields": {
            "rfc_title": "123123123123",
            "rfc_answer_reviewed_by": 1,
            "rfc_required_fcd": true,
            "rfc_drawing_detail_number": "123",
            "rfc_required_sketch": true,
            "rfc_answer_authorized_by": 1,
            "rfc_issued_by": 1,
            "rfc_answer_issued_date": null,
            "rfc_specification_section": "34-5",
            "rfc_answered_date_architect": null,
            "rfc_question": "Salam baba?",
            "rfc_issued_date": null,
            "rfc_answer": "salama back!",
            "rfc_project": 1,
            "rfc_required_fls_review": true,
            "rfc_drawing_page_number": "54",
            "rfc_issued_to": 1
        }
    }
]

如果有人可以提供帮助，我将不胜感激。

Answer 1

库正在寻找来自服务器响应的aaData 属性中的数据。由于服务器正在返回一个对象列表，因此在尝试访问它时会说它是未定义的。

sAjaxDataProp 不能使用空字符串。你可以在这里阅读更多关于你应该从服务器返回的内容：http://legacy.datatables.net/usage/server-side。

将您的 jQuery 部分更改为：

$(document).ready(function () {
    $('#rfctable').dataTable({
        "sAjaxDataProp": 'data',
        "ajax": 'http://127.0.0.1:8000/api/',
        "columns": [
            { "fields": "rfc_number"},
            { "fields": "rfc_title"},
            { "fields": "rfc_question"},
        ]

    });
});

将来自服务器的响应更改为：

{"data": [
    {
        "pk": 1,
        "model": "rfc.rfcdocument",
        "fields": {
            "rfc_title": "123123123123",
            "rfc_answer_reviewed_by": 1,
            "rfc_required_fcd": true,
            "rfc_drawing_detail_number": "123",
            "rfc_required_sketch": true,
            "rfc_answer_authorized_by": 1,
            "rfc_issued_by": 1,
            "rfc_answer_issued_date": null,
            "rfc_specification_section": "34-5",
            "rfc_answered_date_architect": null,
            "rfc_question": "Salam baba?",
            "rfc_issued_date": null,
            "rfc_answer": "salama back!",
            "rfc_project": 1,
            "rfc_required_fls_review": true,
            "rfc_drawing_page_number": "54",
            "rfc_issued_to": 1
        }
    }
]}

您还应该在响应中返回 iTotalRecords、iTotalDisplayRecords 和 sEcho。