Question

我的网页上有一个非常简单的表格。单击按钮后，将提交表单，并将一些数据发送到我的后端。为了处理请求并发送此数据，我构建了一个函数。

现在，在触发请求之前，我想显示一个简单的确认面板。

这是我尝试过的内容，以下是处理表单提交的函数：

$(document).ready(function () {
  $("#settings").submit(function (event) {

      //This should be the confirm button
      $(document).ready(function() {
        swal({
            title: 'Submit your order',
            type: 'info',
            html:"Are you sure?",
            showCloseButton: false,
            showCancelButton: false,
            focusConfirm: false,
            confirmButtonText: 'Confirm',
            cancelButtonText: 'Go back',
        });
      })

      callAJAX(viewsurl,
       {"X-CSRFToken": getCookie("csrftoken") },
       parameters={'settings': $('#settings').val()},

      'post',
       function(data){

       }, null, null );
  return false; 
  });
});

因此，在行callAJAX开始时发送数据。在此之前，有我的小组。按下表单的按钮后，将显示该面板，唯一的问题是，仍然等待发送请求，而不是等待用户点击“确认”按钮，这意味着直到面板被激活，我的代码才会停止关闭;相反，如果未按下“确认”按钮，则不应发送该请求。有没有什么办法解决这一问题？是否有一些示例可以有效地执行此任务？

以下内容将起作用，并将功能保留，直到按下OK按钮为止：

$(document).ready(function () {
  $("#settings").submit(function (event) {

      alert('Are you sure?');

      //Here the request is sent
      callAJAX(viewsurl,
       {"X-CSRFToken": getCookie("csrftoken") },
       parameters={'settings': $('#settings').val()},

      'post',
       function(data){

       }, null, null );
  return false; 
  });
});

Answer 1

这可以帮助您

<!DOCTYPE html>
<html>
<body>

<p>Click the button to display a confirm box.</p>

<button onclick="myFunction()">Try it</button>

<p id="demo"></p>

<script>
function myFunction() {
  var txt;
  var r = confirm("Press a button!");
  if (r == true) {
    txt = "You pressed OK!";
  } else {
    txt = "You pressed Cancel!";
  }
  document.getElementById("demo").innerHTML = txt;
}
</script>

</body>
</html>

提交表单之前显示确认按钮

1 个答案: