Iraklis Iraklis - 1 month ago 15
Ajax Question

MethodNotAllowed on deleting an item with AJAX and Laravel


SOLUTION IN LAST COMMENT OF ANSWER


I have this function here

function delTag(e, name){
var tag_id = $(e).attr('rel');
$.ajax({
type: "DELETE",
url: '/admin/tags/'+ tag_id+'' ,
success: function(data){
$('#tags_tr'+tag_id).remove();
toastr.error('Tag '+name+' has been deleted');
console.log("dsa");
},
error: function(data){
console.log('Error:');
}
});
}


I call it like this:

@foreach($tags as $tag)
<button onclick='delTag(this, "{{$tag->name}}")' rel={{$tag->id}} type="button" data-dismiss="modal" class="btn btn-danger">Yes</button>
@endforeach


And i get this:

enter image description here

My record is deleted from the database correctly, but, ajax throws error. Why is this happaneing?

Here is my whole route if it helps...

Route::get('admin/', 'AdminController@getAdminIndex')->name('admin.index');
Route::delete('admin/users/{id}', 'Auth\\RegisterController@destroy')->name('admin.users.destroy');
Route::put('admin/users/{id}', 'Auth\\RegisterController@update')->name('admin.users.update');
Route::resource('/admin/posts', 'PostController');
Route::resource('/admin/roles', 'RoleController');
Route::delete('/admin/comments/{id}/{user_id}', 'CommentsController@destroy')->name('comments.destroy');
Route::resource('/admin/comments', 'CommentsController', [
'except' => ['store', 'destroy']
]);
Route::get('/administrator', 'AdminController@getAdmin')->name('admin');
Route::put('/admin/comments/approve/{id}', 'CommentsController@updateApprove')->name('admin.comments.approve');
Route::put('/admin/tags/associate/{tagName}', 'TagController@updateAssociation')->name('admin.tags.associate');
Route::put('/admin/categories/associate/{categoryName}', 'CategoryController@updateAssociation')->name('admin.categories.associate');

Route::resource('/admin/categories', 'CategoryController');
Route::resource('/admin/tags', 'TagController');
Route::get('/admin/pages/tables/{user_id}', 'AdminController@getTables')->name('admin.pages.tables');
Route::get('/admin/pages', 'AdminController@getIndex')->name('admin.pages.index');

Answer

With the ajax call you need also to provide csrf_token. You can keep it on the page in the hidden input field, like this for example:

<input id="csrf" type="hidden" name="_token" value="{{ csrf_token() }}">

And then add it to your ajax call with key "_token". So your delTag function will become something like this:

function delTag(e, name){
    var tag_id = $(e).attr('rel');
    var csrfToken = $("#csrf").val(); // here you're obtaining token from the page
    $.ajax({
        type: "DELETE",
        url: '/admin/tags/'+ tag_id+'' ,
        data: {
            "_token": csrfToken //Here you're passing the token 
        },
        success: function(data){
            $('#tags_tr'+tag_id).remove();
            toastr.error('Tag '+name+' has been deleted');
            console.log("dsa");
        },
        error: function(data){
            console.log('Error:');
        }
    });
}