我正在使用jQuery(jquery.validate.js)进行表单验证。我需要检查用户名是否可用,但我无法弄明白该如何操作。请帮忙。
HTML:
<input type="text" name="username" class="required checkAvailability" />
jQuery的:
$(document).ready(function(){
$.validator.addMethod("checkAvailability", function(username) {
var isSuccess = false;
$.ajax({ url: "/checkAvailibility",
data: "username=" + username,
async: false,
success: function(available) {
if (available == "TRUE")
isSuccess = true;
return $("message", returnData).text() == "Username available";
}
});
}, "Username not available");
$("#formID").validate();
});
服务器端程序返回一个字符串,该字符串是&#34; TRUE&#34;或者&#34; FALSE&#34; (由&#34; returnData&#34;变量返回。)
我的问题: 如何将消息和检查结果都返回到validate(),以便消息可以显示在字段旁边,如果用户名不可用,则不会提交表单?
答案 0 :(得分:0)
您可以稍微重构一下代码吗?类似的东西:
$(document).ready(function(){
$validUsername = false;
$("input.checkAvailability").keyup(function(){
$.ajax({ url: "/checkAvailibility",
data: "username=" + $(this).val(),
success: function(available) {
if (available == "TRUE"){
$validUsername = true;
$("message", returnData).text("Username available");
}
else{
// Do something
}
}
});
});
$.validator.addMethod("checkAvailability", function(username) {
return $validUsername;
}, "Username not available");
$("#formID").validate();
});
答案 1 :(得分:0)
检查服务器上的表单字段的标准和最简单的方法是使用“远程”方法。从服务器端方法返回文本'true'或'false',而不是returnData = true或其他任何内容。
Javascript应该是这个
<script>
$(function () {
$('form').validate({
rules: { username:
{
remote: '/checkAvailibility'
}
}
});
});
</script>
答案 2 :(得分:0)
我使用codeigniter实现了这一点。愿这有助于你。
控制器功能:
function checkUserName()
{
$user_name=$_GET['user_name'];
if(isset($user_name))
{
$arr=$this->home_model->checkUserName($user_name);
$cnt=count($arr);
if($cnt > 0)
echo json_encode(false);
else
echo json_encode(true);
}
}
模型功能:
function checkUserName($user_name)
{
$this->db->select('a.id');
$this->db->like('a.user_name',$user_name,'none');
return $this->db->get('accounts a')->result();
$this->db->get('accounts a')->result();
echo $this->db->last_query();
die;
}
HTML和JS:
<input type="text" name="user_name" placeholder="User name" id="user_name" class="form-control" value="">
JS:
$('#signup').validate(
{
rules:
{
user_name:
{
//required: true,
remote: baseUrl+'home/checkUserName'
}
}
//Your Code here.......
}