Как получить json данных после перерисовки данных? - PullRequest
Новая
       27

Как получить json данных после перерисовки данных?

0 голосов
/ 10 марта 2020

Когда страница загружается в первый раз, я получил json объект, возвращенный из контроллера. Но после удаления данных он не возвращает объект json. Я имею в виду, я могу получить доступ к requestTable.ajax.json() после начальной загрузки var requestTable = $('#Request-Table').DataTable({});. Но после любого события, когда таблица была перерисована, requestTable.ajax.json() выдает ошибку.

Моя главная задача - как получить значение recordsTotal из объекта json после каждого события. Может ли кто-нибудь помочь мне с этим?

Маршруты: 

Route::group(['prefix' => '/requests'], function () {
    Route::get('/show', [
        'uses' => 'InvitationController@show',
        'as'   => 'requests.show',
    ]);
    Route::delete('/delete/{id}', [
        'uses' => 'InvitationController@destroy',
        'as'   => 'requests.destroy',
    ]);
});

Контроллер: 

public function show()
{
    return Datatables::of(Invitation::query()->whereNull('invitation_token'))->make(true);
}

public function destroy($id)
{
    $invitations = Invitation::where('id', $id)->delete();

    return Response::json($invitations);
}

Функция DataTable: 

// Initial Load
requestTable = $('#Request-Table').DataTable({
        processing: true,
        serverSide: true,
        order: [[ 3, "asc" ]],
        pagingType: "full_numbers",
        ajax: '{{ route('requests.show') }}',
        columns: [
            { data: 'id', name: 'id' },
            { data: 'email', name: 'email' },
            { data: 'created_at', name: 'created_at' },
        ],
        columnDefs: [
            {
                targets: 0,
                visible: false,
                searchable: false
            },
            { 
                targets: 3,
                render: function(data, type, row, meta){
                        return "<button type=\"button\" class=\"delete-request btn btn-sm btn-danger\" data-toggle=\"modal\" data-target=\"#Modal-Request-Delete\" data-id=\""+row.id+"\">Delete Request</button>";
                },
                searchable: false,
                orderable: false
            }
        ]
    });
});

// Delete Request
$('body').on('click', '#Btn-Delete-Request', function () {
    var requestId = $("#Delete-Request").data("id");
    $("#Delete-Request").prop('id', '');
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });

    $.ajax({
        type: "delete",
        url: "/requests/delete/"+requestId,
        success: function (data) {
            window.requestTable = $('#Request-Table').dataTable();
            window.requestTable.fnDraw();
        },
        error: function (data) {
            console.log('Error:', data);
        }
    });
});

1 Ответ

1 голос
/ 10 марта 2020

Не нужно отправлять данные из удаления, вы можете просто обновить sh вашу таблицу с помощью ajax.reload() функции

ниже, я поставил ваш код с проверкой изменений, работает она или нет 


// Initial Load

var requestTable ;
requestTable = $('#Request-Table').DataTable({
        processing: true,
        serverSide: true,
        order: [[ 3, "asc" ]],
        pagingType: "full_numbers",
        ajax: '{{ route('requests.show') }}',
        columns: [
            { data: 'id', name: 'id' },
            { data: 'email', name: 'email' },
            { data: 'created_at', name: 'created_at' },
        ],
        columnDefs: [
            {
                targets: 0,
                visible: false,
                searchable: false
            },
            { 
                targets: 3,
                render: function(data, type, row, meta){
                        return "<button type=\"button\" class=\"delete-request btn btn-sm btn-danger\" data-toggle=\"modal\" data-target=\"#Modal-Request-Delete\" data-id=\""+row.id+"\">Delete Request</button>";
                },
                searchable: false,
                orderable: false
            }
        ]
    });
});

// Delete Request
$('body').on('click', '#Btn-Delete-Request', function () {
    var requestId = $("#Delete-Request").data("id");
    $("#Delete-Request").prop('id', '');
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });

    $.ajax({
        type: "delete",
        url: "/requests/delete/"+requestId,
        success: function (data) {
            requestTable.ajax.reload();
        },
        error: function (data) {
            console.log('Error:', data);
        }
    });
});

выше var requestTable, поэтому в функции удаления вы можете получить к ней доступ и requestTable.ajax.reload(); этой функции, которую вы можете использовать для обновления sh таблицы

...