从AJAX重新恢复数据,然后推到数据台



我从Ajax和此返回JSON类型中返回。但是,这种变化不能推向DataTable的aaData。我有console.log此变体,并将粘贴复制到DataTable的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"}
            ],
        });
    }
});

尝试一些这样的事情:

$(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>

这是我的JSON

[{"ma":"HH13117001","name":"u00c1o Khou00e1c Hu00e0n Quu1ed1c 2016","nhom":"u00c1o Khou00e1c Hu00e0ng Quu1ed1c - 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 Hu00e0n 2","nhom":"u00c1o Khou00e1c Hu00e0ng Quu1ed1c - 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 Khou00e1c Hu00e0n Quu1ed1c 2016","nhom":"u00c1o Khou00e1c Hu00e0ng Quu1ed1c - 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 Hu00e0n 2","nhom":"u00c1o Khou00e1c Hu00e0ng Quu1ed1c - 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"}],
             });
          }
      });

已解决:)

    <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>

最新更新