我有一个注册表格,根据网站上的一个例子,它被分割成几个块,使用这个代码运行得很好:
$('.register-next').on('click', function () {
var current = $(this).data('currentBlock'),
next = $(this).data('nextBlock');
console.log('current block = ' + current);
console.log('next block = ' + next);
// only validate going forward. If current group is invalid, do not go further
// .parsley().validate() returns validation result AND show errors
if (next > current)
if (false === $('#form-register').parsley().validate('block' + current))
return;
// validation was ok. We can go on next step.
$('.block' + current)
.removeClass('show')
.addClass('hidden');
$('.block' + next)
.removeClass('hidden')
.addClass('show');
});
然后,我想在代码的最后一块添加一个额外的ajax验证,以确保用户名没有被使用。我进行了检查,但问题是,当验证检查通过时,表单将不会提交。单击提交按钮只会再次调用远程功能。
我假设在进行了所有验证检查后,我必须重新分配提交按钮的功能?
ID用户名与表单最后一块的输入字段相关。
感谢
$('#username').parsley().addAsyncValidator(
'validateUsername', function (xhr) {
var UserLogin = $('#username').parsley();
window.ParsleyUI.removeError(UserLogin,'errorUsername');
if(xhr.status == '200'){
console.log("in 200");
return;
}
if(xhr.status == '404'){
response = $.parseJSON(xhr.responseText);
console.log("username exists");
window.ParsleyUI.addError(UserLogin,'errorUsername',response.error);
}
}, 'inc/check_username.php'
);
我终于完成了这项工作。也许有一种简单得多的方法可以做到这一点,但这是有效的。
首先,我的代码犯了一个错误,如果状态是200 ,我需要返回true
$('#username').parsley().addAsyncValidator(
'validateUsername', function (xhr) {
var UserLogin = $('#username').parsley();
window.ParsleyUI.removeError(UserLogin,'errorUsername');
if(xhr.status == '200'){
return true;
}
if(xhr.status == '404'){
response = $.parseJSON(xhr.responseText);
console.log("username exists");
window.ParsleyUI.addError(UserLogin,'errorUsername',response.error);
}
}, 'inc/check_username.php'
);
然后,我添加了一段额外的代码来监听要点击的提交按钮,并在使用javascript提交之前从表单中删除欧芹验证
$('#new-user-submit').click(function(){
$('#form-register').parsley().asyncValidate()
.done(function(){
$('#form-register').parsley().destroy();
$('#form-register').submit(); });
});
我不是javascript的大用户,所以我通常需要一段时间来完成这些事情,但我认为欧芹如此受欢迎,会有更好的支持和文档。