ajax – 刷新jQuery数据表

前端之家收集整理的这篇文章主要介绍了ajax – 刷新jQuery数据表前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
有很多关于这个问题,但我从来没有找到一个为我工作的问题.我有一个简单而简单的 HTML表,身体正在从AJAX调用中填充行.
然后我想使用DataTable插件更新表,但它不起作用.
我有一个HTML表,如下所示:
<table id="myTable">
  <thead>
     <tr>
          <th>1</th>
          <th>2</th>
          <th>3</th>
          <th>4</th>
          <th>5</th>
     </tr>
  </thead>
  <tbody>
  </tbody>
</table>

在我的jQuery页面加载

$(document).ready(function(){
        var oTable = $('#myTable').dataTable({
            "aoColumns": [
              { "bSortable": false },null,null
            ]
        });
});

最后我的下拉列表更改功能

$("#dropdownlist").on("change",function () {
        $("tbody").empty();
            $.ajax({
                type: "POST",url: "@Url.Action("ActionHere","Controller")",dataType: "json",success: function (data) {
                    $.each(data,function (key,item) {
                        $("tbody").append("<tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>");
                    });
                }
            })
        var oTable = $('#myTable').dataTable(); // Nothing happens
        var oTable = $('#myTable').dataTable({ // Cannot initialize it again error
                "aoColumns": [
                  { "bSortable": false },null
                ]
            });
        });

附件等已经被修改为缩短等等,所以不要太多关注它.

基本上问题是如何更新表,我可以做我的AJAX并添加新的数据到表中,但datatable插件不会更新它.
我尝试过其他的东西

.fnDraw(false);

但它什么都不做
当我收到一个JSON错误

fnReloadAjax()

任何线索只是如何刷新表?

尝试这个

最初你初始化了表格,所以首先清除该表

$( ‘#myTable的’)的dataTable()fnDestroy().

然后在ajax成功后再次初始化

$('#myTable').dataTable();

喜欢这个

$("#dropdownlist").on("change",item) {
                        $("tbody").append("<tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>");
                    });
                }
            })
       $('#myTable').dataTable().fnDestroy();
       $('#myTable').dataTable({ // Cannot initialize it again error
                "aoColumns": [
                  { "bSortable": false },null
                ]
            });
        });

DEMO

猜你在找的Ajax相关文章