如何使用带有确定按钮的 SweetAlert 成功？

Question

我使用下面的代码创建了一个 SweetAlert。我用了这个之后，结果显示但是我还没按OK，已经跳到我设置的URL

这是我创建的 SweetAlert 脚本（当我想使用时我保存在我的脚本中，然后我从中取出它，因为我使用的是 Laravel 框架）。

<script type="text/javascript">
  function showSuccessSwal(message) {
    Swal.fire(
      'Success',
      message,
      "success"
    );
  }

  function showErrorSwal(message) {
    Swal.fire(
      'Error',
      message,
      "error"
    );
  }
</script>

这是我正在使用的脚本：

  <script type="text/javascript">
    $('#somthing-form').submit(function(e) {
      e.preventDefault();

      var form = $(this);

      $.ajax({
        type: 'POST', // GET, POST, PUT
        url: form.attr('action'),
        data: form.serialize(),
        success: function(result) {
          showSuccessSwal(result.message);
          window.location.href="{{ route('something.index') }}";
        },
        error: function(xhr) {
          var errorString = '';
          var errors = xhr.responseJSON.errors;
          Object.keys(errors).forEach(function(key) {
            var error_message = errors[key];
            $.each(error_message, function(key, value) {
              errorString += value + '\n';
            });
          });
          showErrorSwal(errorString);
        }
      });
    });
  </script>

我想要这样的结果：

我按下提交按钮。
显示带有确定按钮的 SweetAlert。
等待用户按下OK按钮然后转到我设置的URL（在我按下OK按钮之前不是直接跳转到URL）。

Answer 1

在调用 ajax

之前，您需要先调用 swal

swal({
    title: 'Are you sure to go ahead?,
        type: 'warning',
        showCancelButton: true,
        confirmButtonText: 'Yes, please!'
    }).then(function(result) {
        if (result.value) { // when you click `yes, please!`
            $.ajax({
                type: 'POST', // GET, POST, PUT
                url: form.attr('action'),
                data: form.serialize(),
                success: function(result) {
                showSuccessSwal(result.message);
                window.location.href="{{ route('something.index') }}";
            },
            error: function(xhr) {
                var errorString = '';
                var errors = xhr.responseJSON.errors;
                Object.keys(errors).forEach(function(key) {
                    var error_message = errors[key];
                    $.each(error_message, function(key, value) {
                        errorString += value + '\n';
                    });
                });
                showErrorSwal(errorString);
            });
        }
});

如何使用带有确定按钮的 SweetAlert 成功？

How to use SweetAlert success with OK button?

laravel

sweetalert