【问题标题】:Sweetalert not appearing after success function成功功能后不出现 Sweetalert
【发布时间】:2022-10-07 21:17:04
【问题描述】:

单击删除按钮后,Sweetalert 警告似乎工作正常但是ajax成功功能中的警报作为确认没有出现在页面上

我真的是编码新手,我在 youtube 上关注关于从 php 数据库中删除数据的教程。

我认为我做的一切都是正确的,并重新检查是否有拼写或标点错误或什么,但我无法弄清楚它是什么。请帮我。

$(document).ready(function() {

    $('.delete_product_btn').click(function(e){
        e.preventDefault();

        var id = $(this).val();
        

        swal({
            title: "Are you sure?",
            text: "Once deleted, you will not be able to recover this data!",
            icon: "warning",
            buttons: true,
            dangerMode: true,
          })
          .then((willDelete) => {
            if (willDelete) {
                $.ajax({
                    method: "POST",
                    url: "code.php",
                    data: {
                        'product_id':id,
                        'delete_product_btn': true
                    },

                    success: function (response) {
                        if(response == 200)
                        {
                            swal("Good job!", "Deleted successfully!", "success");

                        }
                        else if(response == 500)
                        {
                            swal("Error!", "Something went wrong!", "error");

                        }

                    }
                });
            } 
          });

    });

 });

【问题讨论】:

  • if(response == 200) 我认为错误就在这里。 Console.log 响应并查看您是否在比较正确的值。可以是response.data
  • 除非您的问题与 PHP 有关(PHP 代码不起作用),否则请删除该标记。如果 PHP 有一些问题,请发布该代码并解释问题(会发生什么,假设会发生什么等)

标签: javascript php ajax bootstrap-4 sweetalert


【解决方案1】:

首先,我假设如果记录未删除,code.php 将返回值“500”,如果记录成功删除,则返回值“200”。

其次,我假设您包含正确的 jquery.js 脚本。

在这种情况下,两个 swal 警报都应该起作用

所以请尝试以下代码: (我创建了一个总是返回 200 的 code.php)

<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<script
  src="https://code.jquery.com/jquery-3.6.1.js"
  integrity="sha256-3zlB5s2uwoUzrXK3BT7AX3FyvojsraNFxCc2vC/7pNI="
  crossorigin="anonymous"></script>


Delete: 
<br>
<input type=button class="delete_product_btn" value="1">
<br>
<input type=button class="delete_product_btn" value="2">

<script>

$(document).ready(function() {

    $('.delete_product_btn').click(function(e){
        e.preventDefault();

var id = $(this).val();


swal({
  title: "Are you sure?",
  text: "Once deleted, you will not be able to recover this imaginary file!",
  icon: "warning",
  buttons: true,
  dangerMode: true,
})
.then((willDelete) => {
  if (willDelete) {



   $.ajax({
                    method: "POST",
                    url: "code.php",
                    data: {
                        'product_id':id,
                        'delete_product_btn': true
                    },

                    success: function (response) {
                        if(response == 200)
                        {
                            swal("Good job!", "Deleted successfully!", "success");

                        }
                        else if(response == 500)
                        {
                            swal("Error!", "Something went wrong!", "error");

                        }

                    }
                });



  } else {
    swal("Delete action aborted!");
  }
});


   });

 });

</script>

您可以在这个完全正常工作的沙盒链接中查看结果:

http://www.createchhk.com/SOanswers/testso7Oct2022.html

【讨论】:

    猜你喜欢
    • 2023-01-20
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-07-16
    • 1970-01-01
    相关资源
    最近更新 更多