在 Laravel 中使用 Sweet Alert 删除方法

2021-12-18 00:00:00 php javascript laravel laravel-5.2 sweetalert

我正在测试一种使用 Sweet Alert 的方法，以改进由 Laravel 框架中的 Javascript 警报方法发出的消息.

I'm testing a method using Sweet Alert, to improve the messages issued by the Javascript alert method with the laravel framework.

1 - 我下载了文件 sweetalert.css 和 sweetalert.min.js.

1 - I downloaded the files sweetalert.css and sweetalert.min.js.

2 - 所以我从 app.blade.php 连接文件

2 - So I connect the files from app.blade.php

<!-- Sweet Alert -->
<link href="{{ asset('/dist/css/sweetalert.css') }}" rel="stylesheet">
<!-- Sweet Alert -->
<script src="{{ asset('/dist/js/sweetalert.min.js') }}"></script>

3 - 我使用 Javascript 的 onclick 事件和以下 Sweet Alert 函数创建了删除按钮:

3 - I created the delete button using the onclick event of Javascript and the following Sweet Alert function:

{!! Form::open(['method' => 'DELETE','route' => ['users.destroy', $user->id],'style'=>'display:inline']) !!}
<button onclick="
 swal({
  title: 'Esta seguro de realizar esta Acción?',
  text: 'Si procede este usuario será eliminado!',
  type: 'warning',
  showCancelButton: true,
  confirmButtonColor: '#DD6B55',
  confirmButtonText: 'Eliminar!',
  cancelButtonText: 'Cancelar',
  closeOnConfirm: false,
  closeOnCancel: false
},
function(){
  swal('Usuario eliminado!', 'Este usuario fue eliminado de nuestros registros.', 'success');
});"
  class="btn btn-danger" data-toggle="tooltip" data-placement="top" title="Eliminar usuario"> <i class="material-icons">delete</i> 
</button>
{!! Form::close() !!}

4 - 这是我从 UserController 中删除用户的方法:

4 - This is my method for deleting users from UserController:

public function destroy($id)
{
    User::find($id)->delete();
    return redirect()->route('users.index')
                    ->with('success','User deleted successfully');
}

5 - 删除用户时出现问题，显示警告消息.

5 - The problem occurs when deleting a user, displays the alert message.

但自动关闭并删除用户，不允许采取确认操作，是否删除用户，Sweet Alert中定义的方法.

But automatically closes and deletes the user without allowing to take the confirmation actions, whether or not to delete the user, method defined in Sweet Alert.

有人可以帮助纠正这个问题或推荐更好的方法，因为我使用 Laravel 作为框架.

Someone who can give a help to correct this problem or recommend a better method, since I am using Laravel as Framework.

推荐答案

无论您确认还是取消删除，您都在对按钮单击执行操作.

You are Performing action on button click irrespective of whether you confirm or cancelled the deletion.

<a href="" class="button" data-id="{{$user->id}}">Delete</a>

Jquery 和 Ajax:

Jquery and Ajax:

$(document).on('click', '.button', function (e) {
    e.preventDefault();
    var id = $(this).data('id');
    swal({
            title: "Are you sure!",
            type: "error",
            confirmButtonClass: "btn-danger",
            confirmButtonText: "Yes!",
            showCancelButton: true,
        },
        function() {
            $.ajax({
                type: "POST",
                url: "{{url('/destroy')}}",
                data: {id:id},
                success: function (data) {
                              //
                    }         
            });
    });
});

还有:

public function destroy(Request $request)
{
    User::find($request->id)->delete();
    return redirect()->route('users.index')
                    ->with('success','User deleted successfully');
}

相关文章