使用 Sweet Alert（又名 Swal）提交表单答案

【问题标题】：Submitting form using Sweet Alert (aka Swal)使用 Sweet Alert（又名 Swal）提交表单
【发布时间】：2018-07-09 11:03:12
【问题描述】：

我正在使用 Swal 替换所有 JavaScript 默认警报和内容。我的一个页面上有一个表单，我也在使用 Swal 要求用户在执行操作之前确认他的操作（删除文件）。

问题是我无法让表单工作。这是 Swal 代码：

jQuery('.deleteFile').click(function(event){
    event.preventDefault();
    swal({
        title: "You sure about deleting this file?",
        icon: "warning",
        buttons: {
            cancel: "hmm let me think this through",
            confirm: "100% sure !",
        },
        dangerMode: true,
    })
    .then((willDelete) => {
        if (willDelete) {
            $('#form1').submit();
        } else {
            return false;
        }
    });
});

这是我的提交按钮：

<button type="submit" name="delete_file" class="btn btn-danger deleteFile">Delete</button>

这里有几件事要提：

当谈到 JavaScript / jQuery 时，我完全是一个新手。所以如果你发现这里有什么搞笑的错误，请原谅我的菜鸟
我对此进行了很多搜索并尝试了我找到的所有建议，例如使用许多用户建议的 isConfirm 功能。但没有一个奏效。使用isConfirm函数实际上是整个代码的bug，连alert部分都没有弹出。
代码的.then((willDelete)部分是Swal的默认代码，实际上可以正常使用。
deleteFile 类指向提交按钮。 ID form1 指向表单本身。
在代码的当前状态下，当用户按下确认按钮时，页面会刷新，看起来它已经完成了工作。但它实际上不起作用。我已经编写了以下代码来测试它：
```
if(isset($_POST['delete_file'])){
    echo 'WOOT IT WORKED!';
}
```

但它没有回显任何东西（QQ）

不用说delete_file是我提交按钮的名称属性。

【问题讨论】：

首先，Java 和 JavaScript 是两个略有不同的东西 :D
是的，就像我说的，我 => 完全是菜鸟：P
一位智者曾经说过：“Java and Javascript are similar like Car and Carpet are similar.”
@ArashBarazandeh Your code seems to work fine。你确定你有一个method="POST" 作为表单属性并且你有一个输入字段“delete_file”吗？
@Ivar：100% 确定。当我删除整个 Swal 代码时，表单和回显部分工作得很好。我的 Swal 编码有一些问题：-/

标签： javascript jquery forms submit sweetalert

【解决方案1】：

不用说delete_file是我提交按钮的名称属性。

这就是问题所在。仅当您单击该按钮时，才会提交提交按钮的名称。如果您使用 JavaScript 提交表单，则不会提交提交按钮名称和值。

为了防止这种情况，您可以将它们添加到隐藏输入中，而不是在提交按钮中包含名称/值：

<input type="hidden" name="delete_file" value="Delete">

或者您可以检查是否设置了其他字段，例如您要删除的文件的 ID。

【讨论】：

我完全不知道这部分：“如果您使用 JavaScript 提交表单，则不会提交提交按钮名称和值。”谢谢你提到这一点。您的隐藏输入建议效果很好。也谢谢你:o)