Question

我从ajax返回变量，这返回JSON类型。但是这种变化无法推向dataTable的aaData。我有console.log这种变体并将粘贴复制到数据表的aaData，它也会运行。

$.ajax({
    type: "POST",
    url: "/khuyenmai/ajax/chonhanghoa",
    data: {data : value}, 
    cache: false,
    dateType: "json",
    success: function(data){
        //var dulieu = JSON.stringify(data);;
        console.log(data);
        $(".table_hanghoa").dataTable({
            "aaData" : data,
            "aoColumns": [
                { "sTitle": "Mã Hàng",   "mData": "ma"},
                { "sTitle": "Tên Hàng",  "mData": "name" },
                { "sTitle": "Thuộc Nhóm", "mData": "nhom"},
                { "sTitle": "Hình Đại Diện",  "mData": "hinh"},
                { "sTitle": "Chọn",    "mData": "check"}
            ],
        });
    }
});

Answer 1

尝试这样的事情：

$(document).ready(function() {
    var dataSet = [];
    dataSet.push(
        [1,"Sasha","Brenna","0800 1111"],
        [2,"Sage","Mia","(01012) 405872"],
        [3,"Chelsea","Allistair","076 0578 0265"],
        [4,"Uta","Savannah","070 1247 5884"],
        [5,"Remedios","Berk","0995 181 0007"],
    );

    // In your case the dataSet is coming from ajax call

    $('#data_table').DataTable( {
        data: dataSet
    });
});

table id="data_table">
        <thead>
            <tr>
                <th>Emp Code</th>
                <th>First Name</th>
                <th>Last Name</th>
                <th>Mobile</th>
            </tr>
        </thead>

        <tbody>
        <!-- Dynamic Body -->
        </tbody>
</table>

Answer 2

这是我的json

[{"ma":"HH13117001","name":"\u00c1o Kho\u00e1c H\u00e0n Qu\u1ed1c 2016","nhom":"\u00c1o Kho\u00e1c H\u00e0ng Qu\u1ed1c - Nam","hinh":"<img src='http:\/\/warehouse.client\/public\/img\/imggoods\/1486890821_TTxv.jpg' class='imgtt'>","check":"<input type='checkbox' name='idhh[]' value='43' style='font-size: 30px;' checked >"},{"ma":"HH13117002","name":"\u00c1o Thun H\u00e0n 2","nhom":"\u00c1o Kho\u00e1c H\u00e0ng Qu\u1ed1c - Nam","hinh":"<img src='http:\/\/warehouse.client\/public\/img\/imggoods\/1486914583_jN4a.jpg' class='imgtt'>","check":"<input type='checkbox' name='idhh[]' value='50' style='font-size: 30px;' checked >"}]

当我将其添加到我的代码时，它也会运行

 $.ajax({
          type: "POST",
          url: "/khuyenmai/ajax/chonhanghoa",
          data: {data : value}, 
          cache: false,
          dateType:"json",
          success: function(data){
            //var dulieu = JSON.stringify(data);;
            console.log(data);
            $(".table_hanghoa").dataTable({
              "aaData" : [{"ma":"HH13117001","name":"\u00c1o Kho\u00e1c H\u00e0n Qu\u1ed1c 2016","nhom":"\u00c1o Kho\u00e1c H\u00e0ng Qu\u1ed1c - Nam","hinh":"<img src='http:\/\/warehouse.client\/public\/img\/imggoods\/1486890821_TTxv.jpg' class='imgtt'>","check":"<input type='checkbox' name='idhh[]' value='43' style='font-size: 30px;' checked >"},{"ma":"HH13117002","name":"\u00c1o Thun H\u00e0n 2","nhom":"\u00c1o Kho\u00e1c H\u00e0ng Qu\u1ed1c - Nam","hinh":"<img src='http:\/\/warehouse.client\/public\/img\/imggoods\/1486914583_jN4a.jpg' class='imgtt'>","check":"<input type='checkbox' name='idhh[]' value='50' style='font-size: 30px;' checked >"}],
              "aoColumns": [
                { "sTitle": "Mã Hàng",   "mData": "ma"},
                { "sTitle": "Tên Hàng",  "mData": "name" },
                { "sTitle": "Thuộc Nhóm", "mData": "nhom"},
                { "sTitle": "Hình Đại Diện",  "mData": "hinh"},
                { "sTitle": "Chọn",    "mData": "check"}],
             });
          }
      });

Answer 3

解决了:)

    <script>
   $('#chonnhom').change(function(e){
    $('#table_hanghoa').dataTable().fnDestroy();
     var value = $('#chonnhom').val();
     var table = $('#table_hanghoa').DataTable({
         processing: true,
        "ajax": {
            url: "/khuyenmai/ajax/chonhanghoa",
            dataSrc: "",
            type : 'POST',
            data: { data: value}
        },
        columns: [
                  {data: "ma"},
                  {data: "name"},
                  {data: "nhom"},
                  {data: "hinh"},
                  {data: "check"}
                ],
    });
        table.draw();
        e.preventDefault();
   });
</script>

从ajax返回数据并推送到datatable

3 个答案: