如何直接在Ajax成功結果上從JSON對象加載數據表？

Question

經過長時間的搜索，我找不到解決這個問題的方法，通過Ajax GET加載Datatables的文檔已被詳細記錄，但是如何在Ajax POST之后直接使用JSON響應呢？

這是我的PHP函數：

function getRelated() {
    var elements = (document.getElementsByClassName('exashare'));
    var query = [];
    for(var i=0;typeof(elements[i])!='undefined';query.push(elements[i++].getAttribute('data-id')));

    query = query.join(',');

    $.ajax({
        type: "POST",
        url: baseUrl+"/requests/get_related.php",
        data: "query="+query+'&_token='+_token, 
        cache: false,

        success: function(html){
            $('#example').DataTable( {
                "processing": true,
                "serverSide": true,
                "ajax": {
                    'url':jQuery.parseJSON(html),
                    "dataSrc": ""
                },
                "columns" : [
                        { "data": "#" },
                        { "data": "id" },
                        { "data": "art" },
                        { "data": "name" },
                        { "data": "title" },
                        { "data": "tag" },
                        { "data": "likes" },
                        { "data": "views" },
                        { "data": "duration" },
                        { "data": "time" }
                   ]
            });
        }
    });
}

成功的JSON如下所示：

{
    "data": [{
        "#": "1",
        "id": "9",
        "art": "default\/def8.jpg",
        "name": "Simon The Cat",
        "title": "Riflessioni sulla vita",
        "tag": "riflessioni,vita,",
        "likes": "1",
        "views": "1024",
        "duration": "185",
        "time": "2015-11-30 19:36:31"
    }, {
        "#": "2",
        "id": "15",
        "art": "default\/def2.jpg",
        "name": "Simon The Cat",
        "title": "Riflessioni sulla morte",
        "tag": "riflessioni,morte,",
        "likes": "1",
        "views": "1003",
        "duration": "185",
        "time": "2015-11-14 12:06:21"
    },
    ...]
}

我也試過這個：

//from this:
$('#example').DataTable( {
    "processing": true,
    "serverSide": true,
    "ajax": {
        'url':jQuery.parseJSON(html),
        "dataSrc": ""
    },
    ...

//to this:
$('#example').DataTable( {
    "ajax": jQuery.parseJSON(html),
    ...

但是在控制台上，它總是向我顯示錯誤"lenght of undefined" 。

我已經嘗試直接從包含以上相同響應的JSON文件URL加載數據，並且效果很好。

如何在Ajax POST成功結果上加載JSON數據以填充表？

Answer 1

最后，經過多次嘗試，我找到了適用於最新Datatables版本（1.10.13）的解決方案：

function getRelated() {
    var elements = (document.getElementsByClassName('exashare'));
    var query = [];
    for(var i=0;typeof(elements[i])!='undefined';query.push(elements[i++].getAttribute('data-id')));

    //parse as string
    query = query.join(',');

    $.ajax({
        type: "POST",
        url: baseUrl+"/requests/get_related.php",
        data: "query="+query+'&_token='+_token, 
        cache: false,

        success: function(html){
            //html is a json_encode array so we need to parse it before using
            var result = jQuery.parseJSON(html);
            $('#example_ert').DataTable( {
                //here is the solution
                "data": result.data,
                "ajax": {
                          "url": result,
                          "dataSrc": ""
                        },
                "columns" : [
                        { "data": "#" },
                        { "data": "id" },
                        { "data": "art" },
                        { "data": "name" },
                        { "data": "title" },
                        { "data": "tag" },
                        { "data": "likes" },
                        { "data": "views" },
                        { "data": "duration" },
                        { "data": "time" }
                   ]
            });
        }
    });
}