在 Laravel 中使用 Sweet Alert 删除方法

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/40579520/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-09-14 14:44:37  来源:igfitidea点击:

Delete method with Sweet Alert in Laravel

javascriptphplaravellaravel-5.2sweetalert

提问by Edward Palen

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

我正在使用 Sweet Alert 测试一种方法,以改进由 Javascript 警报方法与 laravel 框架发出的消息。

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

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

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

2 - 所以我从 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 - I created the delete button using the onclick event of Javascript and the following Sweet Alert function:

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

{!! 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 - This is my method for deleting users from UserController:

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

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

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

5 - 删除用户时出现问题,显示警报消息。

Message generated by Sweet Alert

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.

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

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

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

回答by Sanzeeb Aryal

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 and Ajax:

Jquery 和 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) {
                              //
                    }         
            });
    });
});

And:

和:

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

回答by Neeraj Tangariya

I have implemented this code into my laravel project and my route is resource route for destroy. This code is worked for me. As in above comment location.reload() help me and I put it into code...plz try and let me know...it worked for you or not...

我已将此代码实现到我的 Laravel 项目中,并且我的路线是用于销毁的资源路线。这段代码对我有用。正如上面的评论 location.reload() 帮助我,我把它变成了代码......请尝试让我知道......它是否对你有用......

<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
//.deletebutton is the class name in button
<script>
    $('.deletebutton').on('click', function () {
        // return confirm('Are you sure want to delete?');
        event.preventDefault();//this will hold the url
        swal({
            title: "Are you sure?",
            text: "Once clicked, this will be softdeleted!",
            icon: "warning",
            buttons: true,
            dangerMode: true,
        })
        .then((willDelete) => {
            if (willDelete) {
                swal("Done! category has been softdeleted!", {
                    icon: "success",
                    button: false,
                });
            location.reload(true);//this will release the event
            } else {
                swal("Your imaginary file is safe!");
            }
        });
    });
</script>