Jquery DataTable ajax重新加载不起作用

我尝试了各种方法在ajax查询之后重新加载数据表。然而，它只是不起作用。我尝试了

table.ajax.reload（）

，

table.api（）.ajax.reload（）

，在

datatable（）

和

datatable（）之间切换。他们只是不工作

$(document).ready(function() {
    var table = $('#organizationTable').DataTable();

    $(document).on('click', '.edit-modal', function() {
        $('.modal-title').text('Edit User');
        $('#id_edit').val($(this).data('id'));
        $('#first_name_edit').val($(this).data('first_name'));
        $('#last_name_edit').val($(this).data('last_name'));
        $('#email_edit').val($(this).data('email'));
        $('#user_role_edit').val($(this).data('role_id'));
        $('#user_status_edit').val($(this).data('status_id'));
        id = $('#id_edit').val();
        $('#editModal').modal('show');
    });

    $('.modal-footer').on('click', '.edit', function() {
        if ( $( ".required" ).val().length === 0 ) {

            // Usually show some kind of error message here

            // Prevent the form from submitting
            $('#editModal').modal('show');
            event.preventDefault();
        } else {
            $.ajax({
                type: 'PUT',
                url: '/users/' + id + '/update',
                data: {
                    'id': $("#id_edit").val(),
                    'first_name': $("#first_name_edit").val(),
                    'last_name': $("#last_name_edit").val(),
                    'email': $("#email_edit").val(),
                    'role_id': $("#user_role_edit").val(),
                    'status_id': $("#user_status_edit").val()
                },
                success: function(data) {
                    console.log(data);
                    table.ajax.reload();
                }
            });
        }

    });
} );

我的头中也有一段启动代码

$( document ).ready(function() {
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        dataType: 'json'
    });
});

重新加载datatable的正确方法是

$('#TableID').DataTable().ajax.reload();

您在问题中添加的一段代码

在您定义的数据表中不包含ajax url或Json

应该是这样的

$(document).ready(function() {
    var table = $('#organizationTable').DataTable({
        ajax: "https://api.myjson.com/bins/897v1",
    });


    $('#proces_input').on('click', function() {
        table.ajax.reload(); // reload
    });
});

您可以参考更多示例
当我成功地从AJax更新表单并重新加载datatable时，我将收到一条错误消息，说DataTables警告：table id=organizationTable-无效JSON响应。我想原因是因为我返回了一些与我的datatable格式不匹配的数据。有没有办法检查我的数据表的json格式？因此，我可以尝试创建一个与更新用户的格式匹配的数组，并将其作为json格式返回。或者我在看一个错误的方向。谢谢你们

控制器

public function update(Request $request, $id)
    {
        $user = User::find($id);

        request()->validate([
            'first_name' =>'required',
            'email' => ['required', Rule::unique('users')->ignore($user)],
        ]);

        $user->update($request->all());

        DB::table('model_has_roles')
            ->where('model_id', $user->id)
            ->update(['role_id' => $request->role_id]);

        $request->session()->flash('success', $user->first_name . ' is updated successfully.');

        return response()->json($user);
    }

数据表视图

<table id="organizationTable" class="table table-striped table-bordered">
        <thead>
        <tr>
            <th>Name</th>
            <th>Email</th>
            <th>Role Name</th>
            <th>Status</th>
            <th>Action</th>
        </tr>
        </thead>
        <tbody>
        @foreach($rainman_users as $rainman_user)
            <tr>
                <td style="vertical-align: middle">{{$rainman_user->first_name}} {{$rainman_user->last_name}}</td>
                <td style="vertical-align: middle">{{$rainman_user->email}}</td>
                <td style="vertical-align: middle">{{$rainman_user->getRoleNames()->implode(', ')}}</td>
                @if($rainman_user->status_id == 1)
                    <td class="text-success" style="text-align: center; font-style: italic; vertical-align: middle; font-weight: bold;">{{$rainman_user->userStatus->name}}</td>
                @else
                    <td class="text-danger" style="text-align: center; font-style: italic; vertical-align: middle; font-weight: bold;">{{$rainman_user->userStatus->name}}</td>
                @endif
                <td style="text-align:center;">
                    <button data-toggle="modal" data-target="#editModal" class="edit-modal btn btn-outline-primary"
                            data-id="{{$rainman_user->id}}" data-first_name="{{$rainman_user->first_name}}"
                            data-last_name="{{$rainman_user->last_name}}" data-email="{{$rainman_user->email}}"
                            data-role_id="{{$rainman_user->getRoleIds()->first()}}"
                            data-status_id="{{$rainman_user->userStatus->id}}">
                            <i class="fa fa-pencil-square-o" aria-hidden="true"></i> Detail
                    </button>
                </td>
            </tr>
        @endforeach
        </tbody>
        <tfoot>
        <tr>
            <th>Name</th>
            <th>Email</th>
            <th>Role Name</th>
            <th>Status</th>
            <th>Action</th>
        </tr>
        </tfoot>
    </table>

我认为这是可行的，但我得到了一个错误，即DataTables警告：table id=organizationTable-Invalid JSON响应。我认为是我的表有问题导致了这个问题。我将发布另一个与此相关的问题。检查返回的数据和datatable设置。关于无效JSON的错误，它还提供了一个疑难解答链接。我在下面发布了一个更新的问题，你能看一下吗？
$(document).ready(function() {
    $('#organizationTable').DataTable({
    });

    $(document).on('click', '.edit-modal', function() {
        $('.modal-title').text('Edit User');
        $('#id_edit').val($(this).data('id'));
        $('#first_name_edit').val($(this).data('first_name'));
        $('#last_name_edit').val($(this).data('last_name'));
        $('#email_edit').val($(this).data('email'));
        $('#user_role_edit').val($(this).data('role_id'));
        $('#user_status_edit').val($(this).data('status_id'));
        id = $('#id_edit').val();
        $('#editModal').modal('show');
    });

    $('.modal-footer').on('click', '.edit', function() {
        $.ajax({
            type: 'PUT',
            url: '/rainman-users/' + id + '/update',
            data: {
                'id': $("#id_edit").val(),
                'first_name': $("#first_name_edit").val(),
                'last_name': $("#last_name_edit").val(),
                'email': $("#email_edit").val(),
                'role_id': $("#user_role_edit").val(),
                'status_id': $("#user_status_edit").val()
            },
            success: function(data) {
                console.log(data);
                $('#organizationTable').DataTable().ajax.reload();
            }
        });
    });
} );