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

Question

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

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

Answer 1

正如指出的那样，您可以在 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 提交表单

Submit form through ajax using verify.js

javascript

ajax

jquery

verify