405 (Method Not Allowed) error on a DELETE Ajax Request in Laravel

Question

I know there are several posts about 405 Errors from using AJAX delete. However, none of the solutions from the posts I found worked for me.

I have a view with a table displaying all the products from my database table. On each row there is a delete button to delete the product like so:

{!! Form::open(['method' => 'DELETE', 'route' => ['slider.destroy', $slide->id]]) !!}
    <button type="button" class="deleteproductModal btn btn-xs btn-default btn-flat"
            data-toggle="modal"
            data-product_token="{{ csrf_token() }}"
            data-product_name="{{ $slide->title_slider }}"
            data-product_destroy_route="{{ route('slider.destroy', $slide->id) }}">
        <i class="fa fa-trash"></i>
    </button>
{!! Form::close() !!}

On button click, the following javascript executes which calls the destroy method in the controller to delete the product from the database:

$('button.deleteproductModal').click(function()
{
    var productRoute = $(this).attr("data-product_destroy_route");
    var productName = $(this).attr("data-product_name");
    var productToken = $(this).attr("data-product_token");
    deleteproduct(productRoute, productToken, productName);
});

function deleteproduct(productRoute, productToken, productName)
{
    swal({
        title: "Window product Deletion",
        text: "Are you absolutely sure you want to delete " + productName + "? This action cannot be undone." +
        "This will permanently delete " + productName + ", and remove all collections and materials associations.",
        type: "warning",
        showCancelButton: true,
        closeOnConfirm: false,
        confirmButtonText: "Delete " + productName,
        confirmButtonColor: "#ec6c62"
    }, function()
    {
        $.ajax({
            type: "DELETE",
            url: productRoute,
            headers: { 'X-CSRF-TOKEN' : productToken }
        })
            .done(function(data)
        {
            swal("Window Product Deleted!", productName + " Window Product was successfully delete.", "success");
        })

            .error(function(data)
        {
            swal("Oops", "We couldn't connect to the server!", "error");
        });

    });
}

My controller is a resource controller. Here is the route:

Route::resource('slider','Backend\SliderController');

Here is the destroy method from the controller being called.

public function destroy($id)
{
    $home= Slider::find($id);

    unlink($home->featured_image);

    $home->delete();
    notify()->flash('<h3>Deleted successfully</h3>', 'success', ['timer'=>2000]);
    return redirect('slider');

}

when i delete the product i get oops we couldnt connect to the server sweet alert error but when i fresh the page the data is deleted....any help?

not sure, but are you sure the form itself doesnt submit before any javascript is run? I don't see any type submit in the button ... so it might not. Ayways there is a whole lot of stuff in there =/ I dont think you even need to open & close form if you are going to use a ajax request anyways. — Maarten Kuijper
First you don't need a form for each button. Make one form for all buttons or just remove the form and add the token to your page instead. Second you have to figure out if your ajax is firing or its just submitting now. If your ajax is firing you might have an error in your php code. In google chrome you can check the request data in the developer console. If you provide more information we might give you more useful data in return. — Lars Mertens

Tohid Dadashnezhad Tohid Dadashnezhad · Accepted Answer · 2017-10-01T22:58:51

You have to set ajax type POST but send a parameter named _method with value delete like this:

$.ajax({
        type: "POST",
        data:{
         _method:"DELETE"
        },
        url: productRoute,
        headers: { 'X-CSRF-TOKEN' : productToken }
    });

Or because you use laravel html form helper so it generates _method hidden input automatically so you'd better send all your form inputs such as token and method like this:

 function()
{

    var formData=$('#yourForm').serialize();
    $.ajax({
        type: "POST",
        url: productRoute,
        data:formData
    })
      .
      . 

});

405 (Method Not Allowed) error on a DELETE Ajax Request in Laravel

1 Answers