[英]jquery validation plugin with ajax submit handler not working
在過去的幾天中,我已經大量使用了jquery驗證插件,但尚未將其與ajax提交一起使用。 下面是我要縮小的兩個字段。 提交時,這些值沒有錯誤。 單擊提交按鈕時,沒有任何提交。 它什么也沒做。
HTML:
<form id="account-info-form" action="/process/p_profile_info.php" method="post">
<div class="row margin-bottom-20">
<div class="col-md-6 form-group">
<label>First Name</label>
<div class="input-group">
<span class="input-group-addon">
<i class="fa fa-user fa-fw"></i>
</span>
<input class="form-control" type="text" name="fname"/>
</div>
</div>
<div class="col-md-6 form-group">
<label>Last Name</label>
<div class="input-group">
<span class="input-group-addon">
<i class="fa fa-user fa-fw"></i>
</span>
<input class="form-control" type="text" name="lname"/>
</div>
</div>
</div>
<div class="row margin-bottom-30">
<div class="col-md-12">
<button class="btn btn-primary" type="submit" name="account-info" value="save"><i class="fa fa-check-circle"></i> Save Changes</button>
<button class="btn btn-default" type="reset">Cancel</button>
</div>
</div>
</form>
JS:
$('#account-info-form').validate({
// ajax submit
submitHandler: function (form) {
var $form = $(this);
$.ajax({
type: $form.attr('method'),
url: $form.attr('action'),
data: $form.serialize(),
dataType : 'json'
})
.done(function (response) {
if (response.success == 'success')
{
alert('success');
}
else
{
alert('fail');
}
});
return false; // required to block normal submit since you used ajax
}
});
沒有理由這樣做(( $(this)
不是您期望的那樣)...
var $form = $(this);
只需使用傳遞給函數的form
參數。
submitHandler: function (form) {
$.ajax({
type: $(form).attr('method'),
url: $(form).attr('action'),
data: $(form).serialize(),
dataType : 'json'
})
.done(function (response) {
if (response.success == 'success') {
alert('success');
} else {
alert('fail');
}
});
return false; // required to block normal submit since you used ajax
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.