使用 jQuery 阻止提交时的表单重定向，直到函数完成

发布于 2024-09-25 00:28:27 字数 733 浏览 5 评论 0原文

有没有办法使用 jQuery 强制表单等待函数执行完毕后再提交？

我在多字段表单上有一个提交按钮。我希望提交按钮能够点击服务器来确定当前用户在数据库中是否有任何项目，如果没有，我希望它弹出一个确认窗口以确保用户知道。如果他们已经有一些项目，我希望它跳过弹出窗口并正常提交。

我正在使用这样的东西：

$('#done').click(function(event)
{
    $.post(asyncController + "/checkItems", function(response)
            {
                if(response != "true")
                {
                    var test = confirm('Are you sure?');
                    if(test)
                    {
                        //submit
                    } else
                    {
                        event.preventDefaultAction();
                    }
                }
            }
        );
});

不幸的是，表单不会等待 javascript 完成执行，我会在加载下一页的过程中弹出窗口。

原文

Is there a way, using jQuery, to force a form to wait until a function is done executing before submitting?

I have a submit button on a multi-field form. I would like the submit button to hit a server to determine whether the current user has any items in the database, and if they have none, I would like it to pop up a confirmation window to ensure that the user is aware. If they have some items already, I would like it to skip the popup window and submit as normal.

I'm using something like this:

$('#done').click(function(event)
{
    $.post(asyncController + "/checkItems", function(response)
            {
                if(response != "true")
                {
                    var test = confirm('Are you sure?');
                    if(test)
                    {
                        //submit
                    } else
                    {
                        event.preventDefaultAction();
                    }
                }
            }
        );
});

Unfortunately, form doesn't wait for the javascript to finish executing and I get the pop up mid way through loading the next page.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

木落 2024-10-02 00:28:27

尝试以下操作。总之，它阻止了提交按钮的单击事件的默认提交操作，然后我们获取对表单元素的引用，如果 ajax 调用和确认的结果为 true，则提交此表单。

    $('#done').click(function(event) {

        //prevent submit
        event.preventDefault();

        //get form reference
        var frm = this.form;

        $.post(asyncController + "/checkItems", function(response) {

            if (response != "true") {

                var test = confirm('Are you sure?');

                if (test) {
                    //submit the form
                    frm.submit();
                } 

            }
        });
});

Try the following. In summary it prevents the default submit action of the click event of the submit button, we then grab a reference to the form element and we submit this form if the result of the ajax call and confirm is true.

    $('#done').click(function(event) {

        //prevent submit
        event.preventDefault();

        //get form reference
        var frm = this.form;

        $.post(asyncController + "/checkItems", function(response) {

            if (response != "true") {

                var test = confirm('Are you sure?');

                if (test) {
                    //submit the form
                    frm.submit();
                } 

            }
        });
});

回复收藏 0 原文

~没有更多了~