Question

如何在使用verify.js时通过AJAX提交表单？我希望verify.js只验证登录表单：

<form role="form" method="post" id="login" action="auth/login" >

Answer 1

正如Sparky指出的那样，您可以在beforeSubmit回调中执行AJAX请求。要把它放到预期中，你会做类似的事情：

$('#login').verify({
    'beforeSubmit': function(form, result) {
        if (result) {
            // Since the form is valid, submit form via AJAX.
            $.ajax(...);
        }

        // Form is either invalid or was already submitted, return `false` to tell verify.js to not submit the form.
        return false; 
    }
});

Answer 2

完整示例

<form id="formulario1" name="formulario1" action="destiny.php" method="POST">
<input type="text" name="field" id="field" class="form-control" placeholder="" value="" data-validate="required">
<input type="submit" onclick="function_validate_form()">      


</form>
<script>
function function_validate_form(){
    $('#formulario1').verify({
    'beforeSubmit': function(form, result) {
    if (result) {
        // Since the form is valid, submit form via AJAX.
      alert('OK, send ajax');

      var formData = $("#formulario1").serializeArray();
          var URL = $("#formulario1").attr("action");
          $.post(URL,
              formData,
              function(data)
              {
                 console.log(data);

              },"json")

              .fail(function(jqXHR, textStatus, errorThrown) 
              {
                alert( "error ajax" );

              });


    }else{
        //do nothing
    }

    // Form is either invalid or was already submitted, return `false` to tell verify.js to not submit the form.
    return false; 
}
});
}
</script>
<script src="plugins/jQuery/jQuery-2.1.4.min.js"></script>

<script src="plugins/jQueryUI/jquery-ui.min.js"></script>

<script src="plugins/verify.notify.min.js"></script>

使用verify.js通过ajax提交表单

2 个答案: