Question

我提交了在提交表单时调用的代码，然后通过ajax验证表单。现在，如果验证成功，我该如何提交表格

$('#homeSubscriptionFromSub').submit(function(){    
                var formData = $(this).serialize();
                var formUrl = '/subscriptions/subscribe';

                $.ajax({
                        type: 'POST',
                        url: formUrl,
                        data: formData,
                        success: function(data,textStatus,xhr){
                                if(data == ''){
                                    return true;
                                }else{
                                    $("#subscriptionForm").html(data);
                                }
                        },
                        error: function(xhr,textStatus,error){
                                alert(textStatus);
                        }
                });
                return false;
            });

我在上面的代码中做了什么，我验证了表单服务器端，现在当数据为空时表示它通过了验证测试，如何在数据为空时提交表单，我试过返回true但这是不工作

Answer 1

AJAX调用是异步的。使用submit()方法（不带参数）提交表单。另外，我建议事先使用event.preventDefault()取消表单提交。

要不通过同一功能取消新请求，会创建一个变量，以跟踪表单是否有效。

(function(){
    var valid = false;
    $('#homeSubscriptionFromSub').submit(function(e){    
        if(valid){
            valid = false;
            return; //Don't prevent default
        }
        e.preventDefault();
        var formData = $(this).serialize();
        var formUrl = '/subscriptions/subscribe';

        $.ajax({
                type: 'POST',
                url: formUrl,
                data: formData,
                success: function(data,textStatus,xhr){
                        if(data == ''){
                            valid = true;
                            $('#homeSubscriptionFromSub').submit();
                        }else{
                            $("#subscriptionForm").html(data);
                        }
                },
                error: function(xhr,textStatus,error){
                        alert(textStatus);
                }
        });
        return false;
    });
})();

Answer 2

AJAX 异步。在return false;完成之前，您的函数将$.ajax。您需要同步执行请求，或在AJAX函数完成时触发表单的submit事件。

您可能必须首先取消绑定验证功能，否则您只需在提交时递归验证您的表单。

Answer 3

您必须返回true才能提交，因为您使用了ajax，所以返回false。

$('#homeSubscriptionFromSub').submit(function(){    
                var formData = $(this).serialize();
                var formUrl = '/subscriptions/subscribe';

                $.ajax({
                        type: 'POST',
                        url: formUrl,
                        data: formData,
                        success: function(data,textStatus,xhr){
                                if(data == ''){
                                    return true;
                                }else{
                                    $("#subscriptionForm").html(data);
                                    this.submit();
                                }
                        },
                        error: function(xhr,textStatus,error){
                                alert(textStatus);
                        }
                });
                return false;
            });

在submit（）事件Jquery中提交表单

3 个答案: