Ajax 未执行隐藏表单提交验证

Question

我有以下情况：

我有一个按钮。单击时，会出现一个隐藏的表单和提交按钮。使用 jQuery 验证插件验证表单。在提交处理程序中，我想使用 Ajax 提交表单。我的问题是，我在提交处理程序中编写的代码似乎没有执行。

HTML 页数：

<div class='col-md-9'>
    <div class='media-body'>
        <form id='accountForm'>
            <div class='input-group'>
                <div class='input-group-addon'>
                    First name:
                </div>
                <input class='form-control' type='text' name='firstName'>
            </div>
            <!--- some more inputs --->
        </form>
    </div>
</div>
<div class='col-md-3'>
    <div class='btn-group btn-group-vertical'>
        <!--- some buttons --->
        <button id='saveButton' class='btn' type='submit' form='accountForm'>
    </div>
</div>

JavaScript 文件:

$(document).ready(function() {

    $('#accountForm').hide();
    $('#saveButton').hide();

    $('#editInfoButton').on('click', function() {
        $('#accountForm').show();
        $('#saveButton').show();
    });

    $('#accountForm').validate({
        rules: //some rules
        submitHandler: function(form) {
            $.ajax({
                type: 'POST',
                url: '/account/profile',
                data: $(form).serialize(),
                success: function(data, status, jqXHR) {
                    //some stuff
                }
            });
            return false;
        }
    });
});

当我单击提交按钮时，没有 POST-请求发送到 /account/profile，而是 GET-请求发送到 /account?firstName=...。我真的不明白为什么这不起作用。

Answer 1

所以这个问题有一个不错的答案:

问题中描述的我的情况已被用户 Jack hardcastle 的评论解决。

Stupid question probably: what happens if you state POST in your form tag? The type for AJAX request is POST, however the form still has no action/method defined so the form execution would still follow those.

需要注意的是，与 Sparky 一样，并非所有浏览器都支持 form 属性。 IE.

Ajax 未执行隐藏表单提交验证

Ajax submit in hidden form validation not executed

javascript

forms

ajax

jquery

jquery-validate