sweetalert 删除确认 laravel

Question

我在 laravel 中遇到问题，无法通过 sweetalert[=16= 确认 post 删除]

<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 post id 并且当我想删除时，例如第二个 post中table，最后一个删除！

这是 table:

             <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>

我当然是新手！

Answer 1

问题出在你的url，你没有动态选择需要删除的模型的id，那是因为在你的javascript 在你的 url 上你刚刚打印了 $post->id，这是你不应该做的事情，因为混合 php 和 js 那样是不好的做法...

因此，为了解决您的问题，您应该正确设置 href，要么直接将其插入 href 属性，要么不将 php 与 js 混合使用，例如：选择 $post- >id 与 JS 选择器不是 php，你试图打印 php 到 javascript dinamically 这没有任何意义。你在 js 中的 php 代码将运行 ONCE 这就是为什么它打印 last id 而不是你的元素点击...

您应该尝试做类似...的事情：

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

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

<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>

Answer 2

如果您处理多个记录，您可以使用这个完全动态的代码：

<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>

从数据属性中，您可以获得动态 url 和 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，那么您还需要将令牌传递给 hidden。所以我创建了表单并在其后附加了带有一些隐藏变量的 Body 标签。然后提交即可。

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

Answer 3

您正在删除错误的模式 object.First 您应该向 link 按钮添加数据属性

 <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 代码中检索属性值并更改 url。

 $('.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

sweetalert 删除确认 laravel

sweetalert delete confirm laravel

javascript

parameter-passing

laravel

sweetalert

laravel-blade