javascript - 在ajax成功之后重新加载数据表

我使用JQuery DataTable。我将数据发送到ajax成功的json文件中的数据表onclick。第一次单击一切都很好，但是接下来的单击我只获得了正确的数据和dataTables_info的错误值，它始终显示dataTables_info的第一个值，并且分页和行也从第一个结果。
这是数据表中数据的第一次显示:



所有下一个单击我将仅获得正确的数据:
对于这个示例，它们是下面图片中显示的一个结果，但其他所有内容(信息，显示，分页)都属于第一张图片中显示的第一个搜索:


在第二个示例中，当我单击分页的任何页面时，我都会得到第一页结果的内容!
这是我的函数ONclick:

    $ ( '#ButtonPostJson' ).on('click',function() {

             $("tbody").empty();
             var forsearch = $("#searchItem").val();

    $.ajax({
        processing: true,
        serverSide: true,
        type: 'post',
        url: 'searchData.json',
        dataType: "json",
        data: mysearch,
       /* bRetrieve : true,*/

        success: function(data) {
            $.each(data, function(i, data) {
                var body = "<tr>";
                body    += "<td>" + data.name + "</td>";
               ..........................
               ..........................
                body    += "</tr>";
                $('.datatable-ajax-source table').append(body);

            })
        ;
            /*DataTables instantiation.*/
     $('.datatable-ajax-source table').dataTable();
    },

        error: function() {
            alert('Processus Echoué!');
        },
        afterSend: function(){
    $('.datatable-ajax-source table').dataTable().reload();
 /* $('.datatable-ajax-source table').dataTable({bRetrieve : true}).fnDestroy();
    $(this).parents().remove();
$('.datatable-ajax-source table').dataTable().clear();*/
    }
    });
    });

我尽一切努力，我不知道我想念什么。
我使用这个jQuery的数据表:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>

谢谢。

最佳答案

只需单击一下按钮，您就不需要清空表主体并使用Ajax重新启动数据表。

您只需要再次调用ajax，因为您已经启动了文档就绪功能

只是使用

$("#Table_id").ajax.reload();

检查以下链接，您将有更好的主意。

https://datatables.net/reference/api/ajax.reload()

让我知道这是否对您没有帮助