ajax提交前先验证,jQuery验证AJAX之前提交(jQuery validation before AJAX sub

我有以下的jQuery验证代码的简单注册表格：

$(document).ready(function(){

$("#registerForm").validate({

rules: {

Username: {required: true, minlength: 6},

Password: {required: true, minlength: 6},

re_Password: {required: true, equalTo: "#Password"}

},

});

});

之前，我提交表单它正确验证。

问题是当我想也做一个AJAX提交表单的，因为形式将不再验证和未经验证提交：

该工程默认为：

请，如果任何人都可以点我在正确的方向，或给我一些出发点，以解决这一点，我将不胜感激。

谢谢。

由于Kundan辛格Chouhan我已经找到了解决方案添加以下代码到的document.ready块：

$("#registerForm").submit(function(){

if($("#registerForm").valid()){

xmlhttpPost('register.php', 'registerForm', 'signup-box');

}

return false;

});

Answer 1:

我想你应该有从您的表单标签移除onsubmit事件谱写的document.ready下面的脚本()

$("form").submit(function(){

if($("form").validate()){

xmlhttpPost('register.php', 'registerForm', 'signup-box');

}

return false;

});

希望这将解决您的问题。

Answer 2:

我认为你应该使用提交处理程序JQuery的验证，就像这样：

$('#id_of_form').validate(){

// rules and messages

submitHandler: function(form) {

// place your code for Ajax Request here...

}

}

Answer 3:

你可以使用jQuery.Validation这里是一些示例代码：

var $form = $("form");

$form.validate({

rules: {

Username: {required: true, minlength: 6},

Password: {required: true, minlength: 6},

re_Password: {required: true, equalTo: "#Password"}

},

invalidHandler: function(event, validator) {

// 'this' refers to the form

var errors = validator.numberOfInvalids();

if (errors) {

var message = errors === 1

? 'You missed 1 field. It has been highlighted'

: 'You missed ' + errors + ' fields. They have been highlighted';

}

},

submitHandler: function (form) {

var $form = $(form);

$.ajax({

url: destinationUrl,

method: "POST",

data: $form.serialize()

})

.done(function (result) {

// show some message, etc...

return false; // blocks redirect after submission via ajax

})

.fail(function (response, error) {

// failed

})

.always(function() {

});

}

});

问候。

文章来源: jQuery validation before AJAX submit