简体   繁体   English

设置同步/异步功能序列的正确方法都可以停止表单提交和进一步处理?

[英]Correct way to set up a sequence of synchronous/asynchronous functions all of which can stop form submission and further processing?

  1. I need to call some functions in sequence on form submit button click - 我需要在表单提交按钮单击时依次调用一些函数-

    func1() -> func2() -> func3() ... -> func7() -> ... func1()-> func2()-> func3()...-> func7()-> ...

  2. All these functions do some kind of validation/checking and if validation fails, display a confirmation dialog to the user. 所有这些功能都进行某种验证/检查,如果验证失败,则向用户显示一个确认对话框。 If the user confirms, the next function in queue is executed. 如果用户确认,则执行队列中的下一个功能。

  3. Any of these functions could be doing some asynchronous task like sending Ajax request and depending on the result, showing the user some confirm dialog. 这些功能中的任何一个都可以执行一些异步任务,例如发送Ajax请求,并根据结果显示给用户一些确认对话框。

Details 细节

I have asynchronous functions with the following structure - 我具有以下结构的异步函数-

function preValidateUrls(evt)
{
   evt.preventDefault();

   $.ajax({
       type: "POST",
       url: posturl+"?"+params,
       dataType: "json",
       success: function(res)
           { 
                 //display some confirmation dialog
                 if(confirm(msg)) 
                 {
                       $("form#frmBanners").submit();
                 }
            }
        });
}

How do I do this? 我该怎么做呢?

To begin with I just had two synchronous functions defined like this - 首先,我只定义了两个同步函数,如下所示:

<form onsubmit="return func3()">
...
...
<input type="submit" onclick="return func1()"/>
</form>
  • func1() was being called at first, displaying confirmation dialog, then func2()... 首先调用func1(),显示确认对话框,然后显示func2()...

  • Then I defined asynchronous function func2() (with the same structure as shown above) and called it like this - 然后,我定义了异步函数func2()(具有与上面所示的相同的结构),并这样调用它:

    $("input#formsubmitbutton").click(func2); $(“ input#formsubmitbutton”)。click(func2);

But, as expected, this does not wait for the confirmation of func1(). 但是,正如预期的那样,这并不等待func1()的确认。

  • If I do like the following, the function func2 gets called again and again - 如果我喜欢以下内容,则函数func2会一次又一次地被调用-

    $('form#frmBanners').submit(function() { return func2(); //This is called after preValidateUrls() }); $('form#frmBanners')。submit(function(){return func2(); //在preValidateUrls()之后调用));

How do I do this in a clean way, so the tomorrow when I need to add any synchronous/asynchronous functions in between, I just need to edit at one place, something like - 如何以一种干净的方式执行此操作,因此明天需要在两者之间添加任何同步/异步功能时,只需要在一个位置进行编辑即可,例如-

func1() -> func2() -> func3() ... -> func7()

PS - I know, how to use callback functions in javascript. PS-我知道,如何在JavaScript中使用回调函数。

How about just one function in the submit handler: 提交处理程序中只有一个函数怎么样:

<form action="" onsubmit="return func_test_all();">
</form>

Then inside your func_test_all() you set up a Deferred pipe and return false; 然后在func_test_all()内部设置一个Deferred pipereturn false; at the end to prevent immediate form submission. 最后,以防止立即提交表单。

I have to run, so I don't have a complete code sample; 我必须运行,所以我没有完整的代码示例。 I hope you can figure out the Deferred ;-) will only be back in 3 hours or so. 希望您能弄清楚Deferred ;-)只会在3小时左右回来。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM