Question

我的DataTables设置如下。

var pageData = [
    {
        "id":"2",
        "slug":"about\/history",
        "title":"History",
        "last_updated":"2013-04-21 09:50:41"
    },

    {
        "id":"3",
        "slug":"about",
        "title":"About",
        "last_updated":"2013-04-21 10:42:22"
    }
];

$(function () {
    $("#pageList").dataTable({
        "aaData"      : pageData,
        "aoColumns"   : [
            {
                "sTitle" : "slug"
            },
            {
                "sTitle" : "title"
            },
            {
                "sTitle" : "last_updated"
            },
            {
                "sTitle" : "id"
            }
        ]
    });
});

现在，当我运行此操作时，我收到以下错误警告

DataTables warning (table id = 'pageList'): 
    Requested unknown parameter '0' from the data source for row 0

我认为这是因为数据表使用索引而不是列名来访问来自pageData的数据。我以为sTitle会做这项工作，但事实并非如此。现在，我找不到合适的选项来指定除sName之外的数据表的列名，仅在向服务器发送数据时使用。

我觉得解决方案将是一个我忽略的简单解决方案。那么，我在这里错过了什么？

Answer 1

jQuery datatable接受数据作为数组数组。因此，您必须将数据从对象数组转换为数组数组。

var pageData = [{
    "id": "2",
        "slug": "about\/history",
        "title": "History",
        "last_updated": "2013-04-21 09:50:41"
},

{
    "id": "3",
        "slug": "about",
        "title": "About",
        "last_updated": "2013-04-21 10:42:22"
}];

var aaPageData = [];
for (var i = 0; i < pageData.length; i++) {
    var item = pageData[i];
    aaPageData[i] = [item.slug, item.title, item.last_updated, item.id];
}

$(document).ready(function () {
    $("#table").dataTable({
        "aaData": aaPageData,
        "aoColumns": [{
            "sTitle": "slug",
        }, {
            "sTitle": "title"
        }, {
            "sTitle": "last_updated"
        }, {
            "sTitle": "id"
        }]
    });
});

演示：http://jsfiddle.net/BYcsk/

编辑：您不需要转换。您可以通过为列指定mData属性来实现此目的。错误即将到来，因为你没有给它。

var pageData = [{
    "id": "2",
        "slug": "about\/history",
        "title": "History",
        "last_updated": "2013-04-21 09:50:41"
},

{
    "id": "3",
        "slug": "about",
        "title": "About",
        "last_updated": "2013-04-21 10:42:22"
}];


$(document).ready(function () {
    $("#table").dataTable({
        "aaData": pageData,
        "aoColumns": [{
            "sTitle": "slug",
            "mData": "slug"
        }, {
            "sTitle": "title",
            "mData": "title"
        }, {
            "sTitle": "last_updated",
            "mData": "last_updated"
        }, {
            "sTitle": "id",
            "mData": "id"
        }]
    });
});

演示：http://jsfiddle.net/BYcsk/3/

DataTables - 使用列名而不是索引

1 个答案: