我希望摆脱async = false但我似乎找不到合适的工作
$(document).foundation({
abide : {
validators: {
checkUser: function(el, required, parent) {
var result = $.ajax({
type: "GET",
url: "../functions/checkUsername.php",
data:{
'username': el.value
},
async: false
}).responseText;
return eval(result);
}
}
}
});
FYI:checkUsername.php返回true或false
我尝试了几种不同的方法,但似乎无法找到修改此功能的最佳方法。
答案 0 :(得分:0)
这就是我最终想出来的最终结果。第一部分是在检查失败时将字段标记为无效的功能。第二个允许您通过php或您正在使用的任何内容检查您的数据库。
第一个函数还允许您发送一个字符串,以便您可以更改错误框中的消息集,以防您拥有设置的格式,而不是显示覆盖每个案例的大型消息。
我的php脚本返回1或0. 1表示用户名可用0如果不是。
$(function(){
// Mark Invalid for Username Checks
$.fn.markInvalid = function(text) {
$(this).filter(":input").each(function(i, el) {
console.log($(this).val());
var input = $(el);
var container = input.closest(".row");
var label = container.find("label");
var error = container.find(".form-error");
label.addClass("is-invalid-label");
input.attr("data-invalid", "").addClass('is-invalid-input');
if(text){ error.text(text).addClass('is-visible'); }
});
};
$("#usrnme").on("valid.zf.abide", function(e){
$.post( "checkUsername.php", {'username': $('#usrnme').val()}, function( data ) {
if(data!=1){ $(e.target).markInvalid('The username you entered is already taken.'); }
else{ $('#changeUSR').html('The username must only contain lowercase letters or numbers.'); }
});
});
});
HTML代码
<div>
<label class="label">Username</label>
<input type="text" name="username" id="username" >
<span id="changeUSR" class="form-error">The username must only contain lowercase letters or numbers.</span>
</div>