Question

这是一个在使用ajax请求提交之前调用表单验证函数的简单代码

$(document).ready(function(){
    $('#errors').hide();       
    var serializedData= $("#categoryForm").serialize();
    $("#categoryForm").submit(function(){
                $.ajax({
                type:'POST', 
                url: 'actions/add-category.php', 
                data: serializedData, 
                beforeSubmit:  function(){
                        return $("#categoryForm").validate();
                    },
                success: function(response) {
                     $('#status').html(response);
                    }
                });
        return false;
       });


});

它通过验证并在验证表单之前发送ajax请求如果验证为真，我试图提出请求

$(document).ready(function(){
    $('#errors').hide();       
    var serializedData= $("#categoryForm").serialize();
    $("#categoryForm").submit(function(){
        if($("#categoryForm").validate()){
                $.ajax({
                type:'POST', 
                url: 'actions/add-category.php', 
                data: serializedData, 
                success: function(response) {
                     $('#status').html(response);
                    }
                });
        }
        return false;
       });


});

但这也不起作用

Answer 1

不要在任何情况下提交表单，在点击提交按钮时进行检查 - 然后如果成功 - 进行提交。尝试如下：

$("#submitButton").click(function(){
          if($("#categoryForm").validate()){
                  $.ajax({
                  type:'POST',
                   url: 'actions/add-category.php',
                   data: serializedData,
                   success: function(response) {
                       $('#status').html(response);
                       //if true: 
                       $("#categoryForm").submit();
                          }
                      });


                  }
             return false;
     });

在ajax请求之前进行jquery表单验证？

1 个答案: