我如何prevent表单提交,直到多个Ajax调用已经完成? jQuery的多个、表单、prevent、Ajax

2023-09-10 16:25:46 作者:不是山谷

从AP revious问题...

Following on from a previous question where I asked about disabling a submit button until all ajax calls have finished returning...

人们似乎还在设法即使禁用按钮和警告标志提交表单。我想这可能是从一个文本输入pressingENTER。

It seems that people are still managing to submit the form even with the button disabled and a warning sign. I guess it could be from pressing 'enter' in a text input.

我该如何去有关禁用整个表单,而不是仅仅提交按钮?

How do I go about disabling the whole form, rather than just the submit button?

在code到目前为止是:

The code so far is:

// if we're waiting for any ajax to complete we need to disable the submit
$(document).ajaxStart(function() {
  $(".ajaxbutton").attr("disabled", "disabled");
  // if it's taken longer than 250ms display waiting message
  timer = setTimeout(function() {
    $('#processingAlert').html(' ...please wait one moment');
    $('#processingAlert').show();
  }, 250);
})
$(document).ajaxComplete(function() {
  $(".ajaxbutton").removeAttr("disabled");
    $('#processingAlert').hide();
    // cancel showing the message when the ajax call completes.
clearTimeout(timer);
});

这是我应该提到这可能会导致一个问题,另一件事是,有多个Ajax调用发生在同一时间,例如,一个DIV接收隐藏的输入和页面上的其他地方的另一个分区显示的价格总的实例。

One other thing that I should mention which could be causing a problem is that there are multiple ajax calls happening at the same time, EG one div receives hidden inputs and another div elsewhere on the page shows a price total for instance.

但愿一些Ajax调用完成迅速否定ajaxStart的禁止影响的事实? EG AJAX CALL1和Ajax call2两个火ajaxStart - ?CALL1完成真的很快,将它重新启用,而我们正在等待call2填写表格

Would the fact that some ajax calls are completing quickly negate the disabling effect of ajaxStart? EG ajax call1 and ajax call2 both fire the ajaxStart - call1 finishes really quickly, would it re-enable the form while we are waiting for call2 to complete?

是否有这样做的更好的办法,我们可以简单的测试,如果所有的Ajax调用已经完成?

Is there a better way of doing this where we could simply test if ALL ajax calls have completed?

推荐答案

您可以添加一个事件处理程序提交表单的事件。事件处理程序可以检查是否提交是允许的是,如果没有中止。下面是一些文档: http://api.jquery.com/submit/

You can add an event handler for the submit event of the form. The event handler can check if the submit is allowable yet, and abort if not. Here's some docs: http://api.jquery.com/submit/

请注意,如果JavaScript的网页上调用。点击()上的表单提交按钮之一,表单将不调用您的.submit()处理程序提交。这是一个奇怪的jQuery的问题(​​http://groups.google.com/group/jquery-en/browse_thread/thread/1317bfd4e3a8b233?pli=1),我猜jQuery的人不考虑的错误。可能有其他情况下,像这样,我希望不会。

Note that if javascript on the page calls .click() on one of the form submission buttons, the form will be submitted without calling your .submit() handler. This is a weird jQuery issue (http://groups.google.com/group/jquery-en/browse_thread/thread/1317bfd4e3a8b233?pli=1) which I guess the jQuery folks don't consider a bug. There may be other cases like this, I hope not.

如果您使用的是ASP.NET,根据最新的形式,ASP.NET可能会注入一个__doPostBack功能。您可能需要钩子函数,而不是通过一些定制code调用原来的重新定义。

If you're using ASP.NET, depending on whats on the form, ASP.NET may inject a "__doPostBack" function. You may need to hook that function instead by redefining it with some custom code that calls the original.