如何通过单击功能将 json 加载到 jquery 上的数据表？

Question

我有 json 这样的数据，现在我需要根据发送值在单击搜索按钮时将此 json 数据输入数据表。

[
{
       "port_code":"BOM",
       "cont_details_id":"9",
       "price":"44.000",
       "cont_price":"500",
       "cont_no":"11",
       "cont_size":"20",
       "cont_type":"GP"
},
{
       "port_code":"BOM",
       "cont_details_id":"10",
       "price":"87.000",
       "cont_price":"500",
       "cont_no":"22",
       "cont_size":"20",
       "cont_type":"GP"        
},
.....
.....
etc.,
]

这就是我在 jquery 中尝试在该函数中存储 json $("#search").click(function()我正在调用 json 文件并尝试存储在数据表中，但它不起作用。请有人帮助我。谢谢。

$(document).ready(function() 
    {

    var oTable = $('#example').DataTable();

    $("#search").click(function()
    {
        $.post("invoice_ajax.php",
        {
            loc  : $("#location").val(),
            cust : $("#customer_details_id").val()
        },
        function(data)
        {
            $("#text").html(data);
            var s = JSON.parse(data);

                        for(var i = 0; i < s.length; i++) 
                        {   
                            oTable.fnAddData([
                            s[i].block_id,
                            s[i].block_id,
                            s[i].block_id,
                            s[i].block_id,
                            s[i].block_id,
                            s[i].block_id,
                            s[i].block_id
                            ]);
                        } // End For
        });
    }); 


    });

Answer 1

你几乎是对的，除了你在 1.10.x API 上使用旧的 1.9.x fnAddData 方法。改为这样做：

oTable.row.add([
   s[i].port_code,
   s[i].cont_details_id,
   s[i].price,
   s[i].cont_price,
   s[i].cont_no,
   s[i].cont_size,
   s[i].cont_type
]).draw();

或

var oTable = $('#example').dataTable();
...
oTable.fnAddData([
   s[i].port_code,
   s[i].cont_details_id,
   s[i].price,
   s[i].cont_price,
   s[i].cont_no,
   s[i].cont_size,
   s[i].cont_type
]);

如何通过单击功能将 json 加载到 jquery 上的数据表？

How to load json to datatables on jquery on click function?

javascript

datatable

jquery

json

jquery-datatables