【问题标题】:laravel sweetalert2 Uncaught TypeError: Cannot call a class as a functionlaravel sweetalert2 Uncaught TypeError:无法将类作为函数调用
【发布时间】:2020-10-13 07:08:00
【问题描述】:

我有这个用于实施 sweetalert2 测试。 但是,它会抛出 Uncaught TypeError: Cannot call a class as a function 有什么想法吗?

<html lang="en">
<head>
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@10.5.0/dist/sweetalert2.all.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/promise-polyfill@8/dist/polyfill.js"></script>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sweetalert2@10/dist/sweetalert2.min.css" id="theme-styles">
</head>

<body>
<div class="col-md-12">
<button class="btn btn-danger btn-flat btn-sm remove-user" data-id="{{ $category->id }}" data-action="{{ route('category.destroy',$category->id) }}" > Delete jq</button>
</div>

    <script type="text/javascript">

    $(document).ready(function(){

        $('.remove-user').click(function(){

            id = $(this).attr('data-id');

            /*
            Swal.fire({
            title: 'Error!',
            text: 'Do you want to continue',
            icon: 'error',
            confirmButtonText: 'Cool'
            });
            */

            
            swal({
                title: "Delete?",
                text: "Please ensure and then confirm!",
                type: "warning",
                showCancelButton: !0,
                confirmButtonText: "Yes, delete it!",
                cancelButtonText: "No, cancel!",
                reverseButtons: !0
            }).then(function (e) {

                if (e.value === true) {
                    var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');

                    $.ajax({
                        type: 'POST',
                        url: "{{url('/category')}}/" + id,
                        data: {_token: CSRF_TOKEN},
                        dataType: 'JSON',
                        success: function (results) {

                            if (results.success === true) {
                                swal("Done!", results.message, "success");
                            } else {
                                swal("Error!", results.message, "error");
                            }
                        }
                    });

                } else {
                    e.dismiss;
                }

            }, function (dismiss) {
                return false;
            });            
            
        });
               

    });
    </script>

</body>

进一步更新

当我尝试使用教程页面给出的这个版本 7.2.0 时,它可以工作。 https://www.nicesnippets.com/blog/laravel-sweet-alert2-confirm-delete-example

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.2.0/sweetalert2.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.2.0/sweetalert2.all.min.js"></script>

现在我猜 sweetalert2 的最新版本 10.5.0 不再支持这种写法了...

【问题讨论】:

    标签: jquery laravel-7 sweetalert2


    【解决方案1】:

    试试这个

    
    <html lang="en">
    <head>
        <script src="https://cdn.jsdelivr.net/npm/sweetalert2@10.5.0/dist/sweetalert2.all.min.js"></script>
        <script src="https://cdn.jsdelivr.net/npm/promise-polyfill@8/dist/polyfill.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js" integrity="sha512-bLT0Qm9VnAYZDflyKcBaQ2gg0hSYNQrJ8RilYldYQ1FxQYoCLtUjuuRuZo+fjqhx/qtq/1itJ0C2ejDxltZVFg==" crossorigin="anonymous"></script>
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sweetalert2@10/dist/sweetalert2.min.css" id="theme-styles">
    </head>
    
    <body>
    <div class="col-md-12">
    <button class="btn btn-danger btn-flat btn-sm remove-user" data-id="22" > Delete jq</button>
    </div>
    
        
    </body>
    <script type="text/javascript">
    
        $(document).ready(function(){
    
            $('.remove-user').click(function(){
    
                let id = $(this).attr('data-id');
            
                            Swal.fire({
                      title: "Are you sure?",
                      text: "You will not be able to recover this imaginary file!",
                      type: "warning",
                      showCancelButton: true,
                      confirmButtonColor: "#DD6B55",
                      confirmButtonText: "Yes, delete it!",
                      cancelButtonText: "No, cancel plx!",
                      closeOnConfirm: false,
                      closeOnCancel: false 
                  },
                  function(isConfirm) {
                      if (isConfirm) {
                          swal("Deleted!", "Your imaginary file has been deleted.", "success");
                      } else {
                          swal("Cancelled", "Your imaginary file is safe :)", "error");
                      }
                  }
              );
    
                
                       
                
            });
                   
    
        });
        </script>
    
    </html>
    
    

    听到工作代码链接..https://jsfiddle.net/ar24cpq6/

    【讨论】:

    • 当我点击是,删除它,swal 删除不触发
    • 把 swal 改成 Swal.fire()
    • 现在很好用,所以对于 v10,更改是 swal 到 Swal.fire 的参数,输入到图标
    【解决方案2】:

    对于sweetalert2,这样使用

     Swal.fire({
        title: 'Error!',
        text: 'Do you want to continue',
        icon: 'error',
        confirmButtonText: 'Cool'
    }).then((result) => {
        if (result.isConfirmed)
            swal.fire("Done!", "It was succesfully deleted!", "success");
        else
            swal.fire("Error!", "Coudn't delet!", "error");
    });
    

    【讨论】:

      猜你喜欢
      • 2020-02-11
      • 2018-09-10
      • 2018-04-16
      • 2018-10-21
      • 1970-01-01
      • 2020-02-09
      • 2019-01-08
      • 1970-01-01
      • 2021-12-23
      相关资源
      最近更新 更多