刷新jquery数据表

Question

我正在尝试刷新创建数据表而不重新加载整个页面。因此，每次我尝试搜索结果时，它都会刷新数据表并给出新结果，而不是添加新行。如果我删除$('#investmentTable').empty();。它给了我所有的结果，但它没有刷新我的结果

$('#investmentTable').empty();只彻底清除我的数据表，不显示任何结果

 <div class="control-group">
      <label class="control-label">Enter From Date</label>
      <div style="width:40%" class="controls">
        <input id="fromDate" type="text" name="fromDate" type="text" data-date-format="dd-mm-yyyy" class="datepicker span11">
    </div>
    </div>
    <div class="control-group">
      <label class="control-label">Enter To Date</label>
      <div style="width:40%" class="controls">
        <input id="toDate" type="text" name="toDate" type="text" data-date-format="dd-mm-yyyy" class="datepicker span11">
    </div>
    </div>
    <div class="form-actions">
        <input id="next" class="btn btn-primary" type="button"
            value="Search" />
        <div id="status"></div>
</div>
$("#next").on("click",function(event) {
 $('#investmentTable').empty();

            $.ajax({
                type: 'POST',
                url: app.api+'admin/report/date',
                data: {
                    fromDate: $('#fromDate').val(),
                    toDate: $('#toDate').val()
                },
                success: function(data)
                {
                    if (data.result == true) {
                    for(var i = 0; i < data.data.length; i++){
                        var item = data.data[i][0];

                        var x = $('#investmentTable').DataTable({
                                    responsive: true, 
                                bJQueryUI: true,
                                scrollX: true,
                                height: "100px",
                                display: "block",
                                sPaginationType:  "full_numbers",
                                sDom: '<""l>t<"F"fp>'                       
                        });
                        x.row.add([item.date, item.name, item.email, item.contact.phone, item.account.investedAmount]);
                        x.draw();
                    }
                    }
                },
                return false;
});

Answer 1

能否请您将创建表格的代码移出 for 循环。请尝试以下代码。

$("#next").on("click",function(event) {
$('#investmentTable').empty();

        $.ajax({
            type: 'POST',
            url: app.api+'admin/report/date',
            data: {
                fromDate: $('#fromDate').val(),
                toDate: $('#toDate').val()
            },
            success: function(data)
            {
                if (data.result == true) {
                                        var x = $('#investmentTable').DataTable({
                                responsive: true, 
                            bJQueryUI: true,
                            scrollX: true,
                            height: "100px",
                            display: "block",
                            sPaginationType:  "full_numbers",
                            sDom: '<""l>t<"F"fp>'                       
                    });
                for(var i = 0; i < data.data.length; i++){
                    var item = data.data[i][0];
                    x.row.add([item.date, item.name, item.email, item.contact.phone, item.account.investedAmount]);
                    x.draw();
                }
                }
            },
            return false;
});