首页 > 解决方案 > 如何使用 SweetAlert2 捕获表单提交方法

问题描述

我的javascript知识也很差,所以请帮忙。我正在尝试保护用户页面并添加确认对话框以删除。但我不知道如何捕捉提交方法。我使用来自 sweetalert2 的确认,但不幸的是,表单方法在没有单击任何按钮的情况下运行。

所以我的问题是如何修改代码?

<form action="{{ route('users.destroy', ['user' => \Illuminate\Support\Facades\Auth::id()]) }}" method="post">
    @csrf
    @method('DELETE')
    <button id="comfirm-delete" class="btn btn-danger">User Delete</button>
</form>


<script>
    $(function () {
      'use strict';

      var comfirmDelete = $('#comfirm-delete');

      if (comfirmDelete.length) {
        comfirmDelete.on('click', function() {
          Swal.fire({
            title: 'Are you sure?',
            text: "You won't be able to revert this!",
            showCancelButton: true,
            confirmButtonText: 'Yes, delete it!',
            cancelButtonText: 'No, cancel!',
            customClass: {
              confirmButton: 'btn btn-primary',
              cancelButton: 'btn btn-outline-danger ml-1'
            },
            buttonsStyling: false
          }).then(function(result) {
            if (result.value) {
              Swal.fire({
                icon: 'success',
                title: 'Deleted!',
                text: '',
                customClass: {
                  confirmButton: 'btn btn-success'
                }
              });
            }
          });
        });
      }

    });
 </script>

标签: javascriptformstry-catchlaravel-bladesweetalert2

解决方案


如果我能看到其中一个错误是,我看的是按钮而不是表单?


推荐阅读