sweetalert删除确认laravel

时间:2018-06-08 23:54:04

标签: javascript laravel parameter-passing laravel-blade sweetalert

我在 laravel 中遇到问题,确认 sweetalert

后删除帖子
<script>
        !function ($) {
        "use strict";
        var SweetAlert = function () {
        };
        //examples 
        SweetAlert.prototype.init = function () {

            $('.sa-remove').click(function () {
                swal({
                    title: "are u sure?",
                    text: "lorem lorem lorem",
                    type: "error",
                    showCancelButton: true,
                    confirmButtonClass: 'btn-danger waves-effect waves-light',
                    confirmButtonText: "Delete",
                    cancelButtonText: "Cancel",
                    closeOnConfirm: true,
                    closeOnCancel: true
                },
                function(){
                    window.location.href = "{{ route('panel.posts.remove',$post->id) }}";
                });
            });
        },
        //init
        $.SweetAlert = new SweetAlert, $.SweetAlert.Constructor = SweetAlert
}(window.jQuery),

//initializing 
    function ($) {
        "use strict";
        $.SweetAlert.init()
    }(window.jQuery);
</script>    

但是我在视图中有一个foreach并且它只传递了foreach个帖子id,当我想删除表格中的第二个帖子时,最后一个删除了!< / p>

这是表格:

             <thead>
                <tr>
                    <th>ID</th>
                    <th>Title</th>
                    <th>Body</th>
                    <th>Author</th>
                    <th>Operations</th>
                </tr>
            </thead>
            <tbody>
                @foreach($posts as $post)
                <tr>
                    <td>{{ $post->id }}</td>
                    <td>{{ $post->title }}</td>
                    <td>{{ $post->body }}</td>
                    <td>{{ $post->user->name }}</td>
                    <td>
                         <a href="#" class="sa-remove"><button class="wave-effect btn btn-danger btn-bordred wave-light"><i class="fa fa-times"></i></button></a>
                    </td> 
                </tr>
                @endforeach
            </tbody>

我当然是新手!

3 个答案:

答案 0 :(得分:0)

问题出在你的网址上,你并没有动态地选择需要删除的模型的ID,因为在你的网址上的javascript中你刚刚打印了$ post - &gt; id,这是你不应该做的事情,因为混合php和js是不好的做法...

因此,为了解决您的问题,您应该正确设置您的href,直接将其插入您的href属性或不将PHP与js混合,例如:选择$ post-&gt; id与JS选择器而不是php,你试图将PHP打印到davascript dinamically,这没有任何意义。您在js中的PHP代码将运行 ONCE ,这就是为什么它打印最后一个ID 而不是您点击的元素...

你应该尝试做类似......的事情:

function(){
                window.location.href =  // select post id with js here;
            });

但我要做的是在你的foreach上设置href,这样你就已经设置好并准备发布到你需要的路线上,这样会更有意义

<a href="/your-delete-route/{{$post->id}}" class="sa-remove"><button class="wave-effect btn btn-danger btn-bordred wave-light"><i class="fa fa-times"></i></button></a>

答案 1 :(得分:0)

如果你使用多个记录,你可以使用这个完全动态的代码:

<a href="{{ route('users.destroy', $entity->id) }}"
    class="confirmation"
    data-title="Delete User"
    data-text="Are you sure want to delete this user? ">
     <i class="icon-trash"></i>
</a>

从数据属性中,您可以获得sweetalear框的动态网址和标题。然后将这些信息传递给Javascript。

jQuery(document).on('click', '.confirmation', function (e) {
    e.preventDefault(); // Prevent the href from redirecting directly
    var linkURL = $(this).attr("href");
    var _title = $(this).attr("data-title");
    var _text = $(this).attr("data-text");
    warnBeforeRedirect(linkURL, _text, _title);
});

创建函数然后确认并将用户重定向到删除方法:

function warnBeforeRedirect(linkURL, _text, _title) {
    swal({
        title: _title,
        text: _text,
        type: 'warning',
        showCancelButton: true,
        html: true,
    }, function () {
        var form = $('<form>', {
            'method': 'POST',
            'action': linkURL
        });

        var hiddenInput = $('<input>', {
            'name': '_method',
            'type': 'hidden',
            'value': 'DELETE'
        });

        hiddenToken = $('<input>', {
            'name': '_token',
            'type': 'hidden',
            'value': jQuery('meta[name="csrf-token"]').attr('content')
        });

        form.append(hiddenInput).append(hiddenToken).appendTo('body').submit();
    });
}

如果您使用的是Laravel DELETE Route,那么您还需要将令牌传递给隐藏。所以我创建了表单并使用Body标签添加了一些隐藏变量。然后提交它。

希望它对你有所帮助。祝你好运。

答案 2 :(得分:0)

您正在删除错误的模态对象。首先,您应该将数据属性添加到链接按钮

 <a href="#" data-id="{{$post->id}}" class="sa-remove"><button class="wave-effect btn btn-danger btn-bordred wave-light"><i class="fa fa-times"></i></button></a> code here

然后在您的javascript代码中检索属性值并更改网址。

 $('.sa-remove').click(function () {
            var postId = $(this).data('id'); 
            swal({
                title: "are u sure?",
                text: "lorem lorem lorem",
                type: "error",
                showCancelButton: true,
                confirmButtonClass: 'btn-danger waves-effect waves-light',
                confirmButtonText: "Delete",
                cancelButtonText: "Cancel",
                closeOnConfirm: true,
                closeOnCancel: true
            },
            function(){
                window.location.href = "your-url/" + postId;
            }); here