Here is my view:

<a  href="/article/{{$articles->id}}" data-id="{{$articles->id}}">delete</a>

Here are my scripts:

    $('.js-ajax-deleteConfirm').click(function () {
        let deleteConfirm = confirm('are you sure?');
    
        if (deleteConfirm == true) {
            let clickEle = $(this)
            let id = clickEle.attr('id');
    
            $.ajax({
                url: '/articles/'   id,
                type: 'POST',
                data: {
                    "_token": "{{ csrf_token() }}",
                    'id': id,
                    '_method': 'DELETE'
                }
            })
        }
    });

Here is my route:

Route::delete('/articles/{id}', 'ArticleController@delete')->name('delete');

Here is my controller:

public function delete($id)
{
    $articles = Article::findOrFail($id);
    $articles->delete();
    return redirect()->route('articles_index')->with('msg_success', 'deleted');
}

How can I delete article? after I hit delete and yes button, it stays on the same page and can not delete article.

CodePudding user response：

Make changes as per below code

in route file

Route::delete('/articles/{id}', 'ArticleController@delete')->name('articles.delete');

in blade file

<a  href="javascript:void(0)" data-id="{{ $articles->id }}" data-url="{{ route('articles.delete', ['id' => $articles->id]) }}">delete</a>

js code

$('.js-ajax-deleteConfirm').click(function () {
    if(confirm('are you sure?')){
        var url = $(this).attr('data-url');
        var id = $(this).attr('data-id');

        $.ajax({
            url: url,
            type: 'DELETE',
            data: {
                "_token": "{{ csrf_token() }}",
                'id': id,
            }
        })
    }
});

CodePudding user response：

Change the type to delete in ajax because you are using the delete route and you don't need to add method in data.

Route::delete('/articles/{id}', 'ArticleController@delete')->name('delete');

$('.js-ajax-deleteConfirm').click(function () {
    let deleteConfirm = confirm('are you sure?');

    if (deleteConfirm == true) {
        let clickEle = $(this)
        let id = clickEle.attr('id');

        $.ajax({
            url: '/articles/'   id,
            type: 'DELETE',
            data: {
                "_token": "{{ csrf_token() }}",
                'id': id,
            }
        })
    }
});

CodePudding user response：

Modify your js code like this and make sure that your url is right.

$('.js-ajax-deleteConfirm').click(function (e) {
    e.preventDefault(); // this will prevent your page to refresh on ajax call
    let deleteConfirm = confirm('are you sure?');
    
    if (deleteConfirm == true) {
        let clickEle = $(this)
        let id = clickEle.attr('id');
    
        $.ajax({
            url: '/articles/'   id,
            type: 'DELETE', // type should be delete as per your laravel route
            data: {
                "_token": "{{ csrf_token() }}",
                'id': id,
                '_method': 'DELETE'
            },
            success: function() {
                window.location.reload();
            },
            error: function(error) {
                alert('Failed to delete');
                console.log(error);
            }
        })
    }
});

If your js code is in blade file. You can modify your url like this which will prevent you for future url errors.

url: "{{URL::to('/articles')}}/"   id