在 Ajax JQuery 中提交表单

Question

我必须在 Ajax 中提交一个表单。 我收到“form.submit 不是函数”的 JQuery 错误。

$("#form").validate({

    // Specify the validation rules
    rules: {
        type: "required",
        groups: {
            required: true
        }
    },

    // Specify the validation error messages
    messages: {
        type: "Type is required",
        groups: {
            required: "Group is required" 
        }
    },

    submitHandler: function(form) {
        $.ajax({
            type: "POST",
            url: "check_exists.php",
            data: {
                  groups: $( "#groups" ).val(),
                  type: $( "#type" ).val()
            },
            success: function(data) {
              if(data == "true") {
                    form.submit();  // It shows form.submit is not a function
              } else {
                    // Displays error
              }

            }
        });        
    }
});

当我在 Ajax 上方给出 form.submit() 函数时，它起作用了！ 那么如何在 Ajax 成功函数中提交这个表单呢？

Answer 1

嘿，你可以在这里使用箭头功能功能

$("#form").validate({    
    // Specify the validation rules
    rules: {
        type: "required",
        groups: {
            required: true
        }
    },

    // Specify the validation error messages
    messages: {
        type: "Type is required",
        groups: {
            required: "Group is required" 
        }
    },

    submitHandler: function(form) {
        $.ajax({
            type: "POST",
            url: "check_exists.php",
            data: {
                  groups: $( "#groups" ).val(),
                  type: $( "#type" ).val()
            },
            success: (data) => {
              if(data == "true") {
                    form.submit();
              } else {
                    // Displays error
              }

            }
        });        
    }
});

它将回调函数的上下文绑定到 submitHandler 函数

Answer 2

尝试更改form 变量的范围：

var form_to_be_submitted = null;
$("#form").validate({    
    // Specify the validation rules
    rules: {
        type: "required",
        groups: {
            required: true
        }
    },

    // Specify the validation error messages
    messages: {
        type: "Type is required",
        groups: {
            required: "Group is required" 
        }
    },

    submitHandler: function(form) {
        form_to_be_submitted = form;
        $.ajax({
            type: "POST",
            url: "check_exists.php",
            data: {
                  groups: $( "#groups" ).val(),
                  type: $( "#type" ).val()
            },
            success: function(data) {
              if(data == "true") {
                    form_to_be_submitted.submit();  // It shows form.submit is not a function
              } else {
                    // Displays error
              }

            }
        });        
    }
});