Question

使用swal确认删除时遇到了一些麻烦，我不知道如何使之工作

这是我的刀片视图文件：

<form action="{{ route('user.destroy', $us->id)}}" method="post">
        @method('DELETE')
        @csrf
        <input class="btn btn-danger" type="submit" value="Delete" />
</form>

和使用swal的脚本

  <script>
        //== Class definition
        var SweetAlert2Demo = function() {

            //== Demos
            var initDemos = function() {
                $('.btn-danger').click(function(e) {
                    e.preventDefault();
                    swal({
                        title: 'Are you sure?',
                        text: "You won't be able to revert this!",
                        type: 'warning',
                        buttons:{
                            confirm: {
                                text : 'Yes, delete it!',
                                className : 'btn btn-success'
                            },
                            cancel: {
                                visible: true,
                                className: 'btn btn-danger'
                            }
                        }
                    }).then((Delete) => {
                        if (!Delete) {
                           e.preventDefault();
                        }
                    });
                });
            };

            return {
                //== Init
                init: function() {
                    initDemos();
                },
            };
        }();

        //== Class Initialization
        jQuery(document).ready(function() {
            SweetAlert2Demo.init();
        });
    </script>

swal的版本是https://sweetalert.js.org而不是https://sweetalert2.github.io/

我在laravel 5.8上使用路由资源谢谢你！

Answer 1

发生循环更新

<罢工> 您应该给表单一个id，然后在swal回调中使用ID提交表单

~~<form action="{{ route('user.destroy', $us->id)}}" method="post" id="yourFormId">~~

您的JS Click按钮几乎相同。 Swal JS回调方法只是一些小的更改

        $('.btn-danger').click(function(e) {
                var $form =  $(this).closest("form"); //Get the form here.
                e.preventDefault();
                   swal({
                        title: 'Are you sure?',
                        text: "You won't be able to revert this!",
                        type: 'warning',
                        buttons:{
                            confirm: {
                                text : 'Yes, delete it!',
                                className : 'btn btn-success'
                            },
                            cancel: {
                                visible: true,
                                className: 'btn btn-danger'
                            }
                        }
                    }).then((Delete) => {
                        console.log(Delete); //This will be true when delete is clicked
                        if (Delete) {
                           $form.submit(); //Submit your Form Here. 
                           //$('#yourFormId').submit(); //Use same Form Id to submit the Form.
                        }
                    });
        });

Answer 2

使用GET方法而不是POST。无需使用按钮或组合任何东西。尝试这个示例，该示例始终适用于我的所有项目。如使用定位标记，而不是按钮

<a class="btn btn-action text-danger" title="Delete" data-toggle="tooltip" onclick="deletefunction({{$your_id}})"><i class="fa fa-trash"></i></a>

添加脚本为，

<script>
var deletefunction = function(id){
        swal({ 
            title: "Are you sure you want to Delete this?",
            type: "warning",
            showCancelButton: true,
            confirmButtonColor: "#DD6B55",
            confirmButtonText: "Yes",
            closeOnConfirm: false,
            preConfirm: function(result) {
                window.location.href = '{{url('/your_route/delete')}}/'+id;
            },
            allowOutsideClick: false
        });
    };
</script>

在Laravel 5.8上使用swal确认删除

2 个答案: