判斷用戶名唯一性
dao層：
@Query(value="select * from stu where name like CONCAT('%',:name,'%')",nativeQuery=true)
List<Stu> findByName(@Param("name") String name);
以上SQL語句也可以進行模糊查詢，以後會有說明
service層：
public List<Stu> findByName(String name) {
return stuDao.findByName(name);
}
controller層：
//判斷是否有重複名字
@RequestMapping("findByName")
@ResponseBody
public boolean findByName(HttpServletRequest request) {
String name=request.getParameter("name");
if (stuService.findByName(name).size()>0) {
return true;
}else {
return false;
}
}
以下是添加頁面的代碼：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="/js/jquery-1.8.3.min.js"></script>
<!-- 我導入的是本地的js文件，如果你沒有本地的，也可以導入網上的,
例如：<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>這種的菜鳥教程有很多 -->
<script type="text/javascript">
function check(){ //這個是判斷姓名不能爲空的方法
var name=document.getElementById("name");
if(name.value==null ||name.value=="" ||name.value.length==0){
alert("姓名不能爲空！")
name.focus();
return false;
}
return true;
}
$(function(){// 這個是判斷姓名唯一性的方法
$("#name").blur(function(){
var name=$("#name").val();//獲取ID爲name的值
//alert(name);
$.post("/stu/findByName",{name:name},function(data){
if(data==true){
$("#err").html("<font color='red'>該名稱已被註冊</font>");
$("#submit").attr("disabled",true);
}else{
$("#err").html("<font color='green'>可以註冊</font>");
$("#submit").attr("disabled",false);
}
});
});
});
</script>
</head>
<body align="center">
<!-- 這裏的提交路徑是controller裏面的添加方法，改成你自己的 -->
<form action="/stu/save" method="post">
姓名：<input type="text" name="name" id="name"><span id="err"></span><br>
性別：<input type="text" name="sex" id="sex"><br>
地址：<input type="text" name="address" id="address"><br>
身份證號：<input type="text" name="sid" id="sid"><br>
電話：<input type="text" name="iphone" id="iphone"><br>
<input type="submit" id="submit" onclick="return check()" value="提交">
<input type="reset" value="重置">
</form>
</body>
</html>
下面附上幾張效果圖
我的數據庫裏有111這個用戶名，當你輸完之後，觸發失焦事件
ajax會出來提示，同時，disabled 觸發，提交按鈕變爲灰色，無法點擊。
當沒有與數據庫中重名的時候，ajax會提示可以註冊
提交按鈕也就可以點擊
效果圖有點難看，不要介意