Sweet Alert delete using Laravel ?

 Delete btn:

<a href="{!!route('news-letter-delete',$row->id )!!}" class="btn btn-danger deleteBtn pull-right py-0" data-token="{!! csrf_token() !!}" data-id="{!! $row->id !!}"><span class="icofont icofont-trash"> </span></a>

web.php

Route::delete('/news-letter-delete/{id}',

[

'as' => 'news-letter-delete',

'uses' => 'Admin\NletterController@destroy',

'middleware' => ['permission:All|Configuration']

]

)->where('id', '[0-9]+');

Controller:

public function destroy($id)

    {

        $deleteData = Nletter::FindOrFail($id); 

        try{

            $deleteData->delete();

            NletterDetail::where('nletter_id',$id)->delete();

            $bug = 0;

        }

        catch(\Exception $e){

            $bug = $e->errorInfo[1];

        }

        if($bug==0){

            echo "success";

              

        }else{

            echo 'error';

        } 

         

    }

CSS :

      <!-- sweetalert css -->

   <link rel="stylesheet" href="{!! asset('js/sweetalert/sweetalert.css') !!}">

JS: include  master.blade.php 

<script src="{!! asset('js/sweetalert/sweetalert-dev.js') !!}"></script>

   <script type="text/javascript">

     $(document).on('click', '.deleteBtn', function () {

                var actionTo=$(this).attr('href');

                var token=$(this).attr('data-token');

                var id=$(this).attr('data-id');

                swal({

                        title: "Are you sure?",

                        text: "You will not be able to recover this imaginary file!",

                        type: "success",

                        showCancelButton: true,

                        confirmButtonClass: 'btn-danger',

                        confirmButtonColor: "#DD6B55",

                        confirmButtonText: 'Yes, delete it!',

                        cancelButtonText: "Cancel",

                        closeOnConfirm: false,

                        closeOnCancel: false

                    },

                    function (isConfirm) {

                        if (isConfirm) {

                            $.ajax({

                                url:actionTo,

                                type: 'post',

                                data: {_method: 'delete',_token:token},

                                success: function (data) {

                                    if (data == 'hasForeignKey') {

                                        swal({

                                            title: "Oops!",

                                            text: "This data is used anywhere",

                                            type: "error"

                                        });

                                    } else if(data == 'success'){

                                        swal({

                                                title: "Deleted!",

                                                text: "Your information delete successfully.",

                                                type: "success"

                                            },

                                            function (isConfirm) {

                                                if (isConfirm) {

                                                    $('.' + id).fadeOut();

                                                }

                                            });

                                    }else{

                                        swal({

                                            title: "Fail to Delete!",

                                            text: "Something Error Found !, Please try again.",

                                            type: "error"

                                        });

                                    }

                                }

                            });

                        } else {

                            swal("Cancelled", "Your data is safe .", "error");

                        }

                    });

                return false;

            });

  </script>

Vue js delete ?

 HTML:

<button type="button" @click="deleteComment(row.id,index)" ><i class="fa fa-trash-o text-danger hand"></i></button>

Web.php:

 Route::delete('/delete-ticket-comment/{id}', 'Admin\TaskController@deleteTicketComment')->name('backoffice.delete-ticket-comment');

Controller:

public function deleteTicketComment($id){ 

        $taskComment =TaskRemark::findOrFail($id)->delete(); 

    }

Vue Js 

deleteComment:function(id,index) {

                  var ref = this;

                     swal({

                        title: "Are you sure?",

                        text: "You will not be able to recover this data!",

                        type: "warning",

                        showCancelButton: true,

                        buttonsStyling: false,

                        confirmButtonClass: 'btn btn-primary',

                        cancelButtonClass: 'btn btn-light',

                        confirmButtonText: "Yes, delete!",

                        cancelButtonText: "No, cancel!"

                         

                    }).then((willDelete) => {

                           if (willDelete) {

                                axios({

                                  method:'delete',

                                  url:"{{ url('backoffice/delete-task-comment') }}/"+id, 

                                  

                                }).then(function (response) {

                                     ref.alert('Delete Successful','success');

                                     ref.task_remarks.splice(index, 1);

                             });

                           } else {

                                 return true;

                        }

                    }); 

                

                }

            },

Others :

<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>

deleteComment:function(id,index) {

                  var ref = this;

                     swal({ 

                        title: "Are you sure?",

                        text: "You will not be able to recover this data!",

                        icon: "warning",

                        buttons: true,

                        dangerMode: true,

                         

                    }).then((willDelete) => {

                           if (willDelete) {

                                axios({

                                  method:'delete',

                                  url:"{{ url('backoffice/delete-task-comment') }}/"+id, 

                                  

                                }).then(function (response) {

                                     //ref.alert('Delete Successful','success');

                                     swal("Delete Successful!");

                                     ref.task_remarks.splice(index, 1);

                             });

                           } else {

                                 swal("Your imaginary file is safe!");

                        }

                    });  

                }