如何在注销表单中使用 Sweet alert 2？

Question

我有这个代码可以注销。这适用于标准确认框，但不适用于 Sweet alert 2。任何人都可以告诉我为什么吗？谢谢你。第一个代码是名为 dropzone.php 的页面中的表单，甜蜜警报代码也在此文件中。然后我有一个名为 logout.php.

的单独文件

    <form name="logoutform" method="post" action="logout.php" id="logoutform">
    <input type="hidden" name="form_name" value="logoutform">
    <button class="logoutform_button" type="submit" name="logout" value="Logga ut" id="logout"/></button>
</form>


//This works:
<script>
$(function(){
    $('#logout').click(function(){
        if(confirm('Are you sure to logout')) {
        return true;
        }

        return false;
        });
    });
</script>

//This do not work:
<script>
    $("#logout").on("click", function() {
        swal({
        title: 'Logga ut?',
        type: 'warning',
        showCancelButton: true,
        confirmButtonColor: '#3085d6',
        cancelButtonColor: '#d33',
        confirmButtonText: 'OK'
    })  
    })  
</script>


//This is the code i have in the logout.php file:
<?php
if ($_SERVER['REQUEST_METHOD'] == 'POST' && $_POST['form_name'] == 'logoutform')
{
if (session_id() == "")
{
    session_start();
}

unset($_SESSION['password']);
header('Location: dropzone.php');
exit;
}  
?>

Answer 1

我想这会继续提交注销而不弹出 sweetalert。要获得您想要的结果，请将登录按钮类型从 "submit" 更改为 "button"。传递回调以检查单击的按钮，如果确认单击。继续提交表格

<button class="logoutform_button" type="button" name="logout" value="Logga ut" id="logout"/></button>
<script>
$("#logout").on("click", function() {
    swal({
    title: 'Logga ut?',
    type: 'warning',
    showCancelButton: true,
    confirmButtonColor: '#3085d6',
    cancelButtonColor: '#d33',
    confirmButtonText: 'OK',
    closeOnConfirm: true,
    closeOnCancel: true
   }).then((result) => { 
      if (result.value===true) { 
         $('#logoutform').submit() // this submits the form 
      } 
   }) 
})

如何在注销表单中使用 Sweet alert 2？

How to use Sweet alert 2 with logout form?

php

jquery

sweetalert2