使用ajax数据表显示数据


Display data with ajax datatable

我已经被这个问题困扰了一整天,基本上我有一个表,我需要通过datatable用ajax发送数据multidimensional array $list,这样我就可以json编码并发送回显示:

$('#table_test').dataTable( {
    "bProcessing": false,
    "bServerSide": true,
    "bJQueryUI": true,
    "sAjaxSource": "ajax.php",
    "sAjaxDataProp": "data",
    "fnServerData" : function(sSource, aoData, fnCallback) {
        jQuery.ajax({
            "dataType" : "json",
            "type" : "POST",
            "url" : sSource,
            "data" : aoData,
            "success" : function(data) {
               fnCallback(data);
            }
        });
    },
    "aoColumns": [
        { "mData": "thumbnail" },
        { "mData": "title" },
        { "mData": "category" },
        { "mData": "price" },
        { "mData": "date_post" },
        { "mData": "actions" }]
});

ajax.php(用于测试)

<?php
    $array = array(
        "aaData" => array(
            array(
                'thumbnail' => "1",
                'title' => "1",
                'category' => "1",
                'price' => "1",
                'date_post' => "1",
                'actions' => "ONE"
            ),
            array(
                'thumbnail' => "1",
                'title' => "2",
                'category' => "2",
                'price' => "2",
                'date_post' => "2",
                'actions' => "TWO"
            ),
            array(
                'thumbnail' => "3",
                'title' => "3",
                'category' => "3",
                'price' => "3",
                'date_post' => "3",
                'actions' => "THREE"
            ),
        )
    );
    echo json_encode($array);
?>

下面是我想要填充数据的标签:

<table cellpadding='0' cellspacing='0' border='0' class='datatable table table-striped table-bordered' id='table_test' >
</table> 

有什么帮助吗?感谢。

只是一个想法,你有没有尝试改变mData字符串在aocolcolumns像这样的aaData ?

 },
"aoColumns": [
    { "aaData": "thumbnail" },
    { "aaData": "title" },
    { "aaData": "category" },
    { "aaData": "price" },
    { "aaData": "date_post" },
    { "aaData": "actions" }]

});