Question

当前，我的dataTable jQuery正在从compact

获取数据

我的刀片： task.blade.php

                    $.ajax({
                        headers:{'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
                        url: "{{ route('task_save') }}",
                        method: "POST",
                        data:{
                            proceed:"TRUE",
                            task_title:task_title,
                            weight:weight,
                            desc:desc
                        }, 
                        dataType: "json",
                        success:function(data)
                        {
                            if(data.success.length > 0){
                                refreshTable();
                                toastr.success(data.success[0]);
                                // alert(data.success[0]);              
                            }else{
                                toastr.error(data.error[0]);
                                // alert(data.error[0]);
                            }
                        },
                        error: function(xhr, ajaxOptions, thrownError){
                            console.log(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
                        }
                    });

我的 TaskController

$task_record = TaskModel::orderBy('created_at','desc')
->get();

return view('admin.task', compact('task_record'))->render();

并在我的task.blade.php用过的include('admin.taskDatatable')

由于我的数据表已编码在此文件中：taskDatatable.blade.php

这是我的 taskDatatable.blade.php

<table id="dtMaterialDesignExample" class="table table-striped" cellspacing="0" width="100%">
    <thead>
        <tr>
        <th class="th-sm">Task Title
        </th>
        <th class="th-sm">Task Description
        </th>
        <th class="th-sm">Weight %
        </th>
        <th class="th-sm">Created By
        </th>
        <th class="th-sm">Created Date
        </th>
        <th class="th-sm">Action
        </th>

        </tr>
    </thead>
    <tbody id="taskRcrd">
            @if(count($task_record) > 1)
            @foreach($task_record as $field)
            <tr>
            <td>{{$field->task_title}}</td>
            <td>{{$field->task_desc}}</td>
            <td>{{$field->weight}}</td>
            <td>{{$field->updated_by}}</td>
            <td>{{$field->created_at}}</td>
            <td></td>
            </tr>
            @endforeach
            @else
            <tr>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            </tr>
            @endif
    </tbody>

    </table>

这是我的refreshTable()

 <script>
 function refreshTable() {
     $("#dtContainer" ).load(" #dtMaterialDesignExample");
 }
 </script>

我正在尝试在ajax成功之后刷新dataTable

数据表可以正常刷新，但是整个数据表不能像pagination, search text, show entries那样工作，这意味着数据表的所有功能均无法正常工作，但数据可以成功刷新。

已更新

尝试此代码后

<script>
 function refreshTable() {
$("#dtMaterialDesignExample").DataTable().ajax.reload()
}
</script>

Answer 1

您可以执行以下操作：

function refreshTable(){
var table =  $('#tableId');
table.DataTable().ajax.reload();
}

Answer 2

尝试一下。

function refreshTable(){
    $("#dtMaterialDesignExample").DataTable().ajax.reload();
}

您无需为其创建函数，可以直接在成功函数

中调用它

success:function(data)
{
    if(data.success.length > 0){
        $("#dtMaterialDesignExample").DataTable().ajax.reload();
        toastr.success(data.success[0]);

    }else{
        toastr.error(data.error[0]);

    }
},

查看有关ajax.reload() ajax.reload()

的更多信息

使用ajax reload-refresh-table-after-event

检查

Answer 3

尝试一下：

success: function (data) {
    $('#form').trigger("reset");
}

https://www.tutsmake.com/laravel-5-8-datatables-ajax-crud-tutorial/

Answer 4

<script>
 function refreshTable() {
   $("#dtMaterialDesignExample").DataTable().ajax.reload()
   }
</script>

在ajax提交后刷新dataTable

4 个答案: