要求:
寫一個通訊錄,要求每個用戶通過註冊登錄後可以查詢自己通訊錄的聯繫人
有兩張表用戶表t_user,表中字段id,name,password,email聯繫人t_person表,表中字段id,name,phoneNumber,email,address
1.用戶登錄註冊,註冊成功進行提示三秒後跳轉到登錄頁面,登錄成功後進入聯繫人展示頁面
用戶註冊進行非空校驗,以及用戶名是否已經存在校驗,
如果用戶登錄失敗提示用戶名或密碼錯誤
2.如果用戶沒有登錄就進行查詢聯繫人信息則強制用戶登錄
3.用戶進入聯繫人查詢頁面可以根據員工的姓名進行模糊查詢,
可以根據員工的電話號碼進行模糊查詢
4.用戶可以添加聯繫人,添加信息進行JS非空校驗,添加聯繫人成功後提示用戶添加成功
5.用戶可以對聯繫人信息進行單個刪除或批量刪除,刪除時提示用戶是否確定刪
------------pojo類------------------
public class User {
private Integer id;
private String username;
private String password;
private Date birthday;
private String gender;
private String email;
private List<Person> list;
}
public class Person {
private Integer pid;
private String pname;
private String phone;
private Date pbirthday;
private String address;
private String pemail;
private Integer uid;
}
userok.jsp
<head>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-1.8.3.js"></script>
<script type="text/javascript">
window.setTimeout(function(){
location.href="${pageContext.request.contextPath}/login.jsp";
},3000);
</script>
</head>
<body>
<center><h4>註冊成功,三秒鐘後跳轉到登錄頁面...</h4></center>
</body>
----------reg.jsp-----------
<head>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(function(){
var username=false;
var password=false;
var email=false;
var d=false;
$("#username").blur(function(){
$("span").empty();
if($(this).val()==null || $(this).val()==""){
var span="<span id='a'><font color='red'>用戶名不能爲空</font></span>";
$(this).after(span);
username=false;
}else{
$.post("${pageContext.request.contextPath }/user/isExist.do",
{username:$("#username").val()},
function(data){
if (data == "error") {
var span="<span id='d' ><font color='red'>用戶名重複</font></span>";
$("#username").after(span);
} else {
var span="<span id='e'><font color='red'>用戶名可以使用</font></span>";
$("#username").after(span);
}
}
,"json");
username=true;
}
});
$("#password").blur(function(){
$("span").empty();
if($(this).val().length<3){
var span="<span id='b'>密碼不能爲空</span>";
$(this).after(span);
password=false;
}else{
password=true;
}
});
$(":input[name='email']").blur(function(){
var email1 = $(this).val();
$("span").empty();
var reg = /\w+[@]{1}\w+[.]\w+/;
if(reg.test(email1)){
email=true;
}else{
var span="<span id='w'>email格式不正確</span>";
$(this).after(span);
email=false;
}
});
$("#code").blur(function(){
$.post("${pageContext.request.contextPath}/user/test.do",{"code":$("#code").val()},function(data){
if(data=="ok"){
alert(data);
d=true;
}else{
alert(data);
d=false;
}
},"json");
});
$("img").click(function(){
$(this).attr("src","${pageContext.request.contextPath }/user/ke.do?date="+new Date());
});
$("#a").click(function(){
$("img").prop("src","${pageContext.request.contextPath }/user/ke.do?date="+new Date());
});
$("#chen").click(function (){
if(password && username && email && d){
/* $("form").submit(); */
$.post("${pageContext.request.contextPath }/user/insertUsers.do",
$("form").serialize(),
function(data){
console.log(data);
if (data == "ok") {
alert("成功");
location.href = "${pageContext.request.contextPath }/userok.jsp";
} else {
alert("失敗");
location.reload();}
}
,"json");
}else{
alert("請正確輸入信息");
}
});
});
</script>
</head>
<body>
<form >
username:<input type="text" name="username" id="username" /><br>
password:<input type="password" name="password" id="password" /><br>
birthday:<input type="date" name="birthday" id="birthday" /><br>
gender:<input type="radio" name="gender" value="男" />男
<input type="radio" id="gender" name="gender" value="女" />女<br>
email:<input type="text" name="email" id="email" /><br>
驗證:<input type="text" id="code" name="" /><img src="${pageContext.request.contextPath }/user/ke.do" width="100px" height="50px"/>
<a href="javaScript:" id="a">看不清?換一張</a><br>
<br>
<input type="button" id="chen" value="reg" />
</form>
</body>
-----------insert.jsp------------------
<form action="${pageContext.request.contextPath }/person/insertPerson.do">
pname:<input type="text" name="pname" /><br>
phone:<input type="phone" name="phone" /><br>
pbirthday:<input type="date" name="pbirthday" /><br>
address:<input type="text" name="address" /><br>
pemail:<input type="text" name="pemail" id="email" /><br>
<input type="text" name="uid" value="${user.id }" />
<br>
<input type="submit" value="添加" />
</form>
--------------------------list.jsp-------------------------
<head>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(function(){
$("#a").click(function(){
$(":checkbox[name='items']").attr("checked",this.checked);
});
/* $(":checkbox[name='items']").click(function(){
$("#a").attr("checked",$(":checkbox[name='items']").length==$(":checkbox[name='items']:checked").length);
}); */
$("#b").click(function(){
var aa=new Array();
$(":checkbox[name='items']:checked").each(function(){
aa.push($(this).val());
});
location.href="${pageContext.request.contextPath}/user/daochu.do?ids="+aa;
});
$(".delete").click(function(){
window.confirm("確定刪除?");
});
$("#c").click(function(){
var aa=new Array();
$(":checkbox[name='items']:checked").each(function(){
aa.push($(this).val());
});
if(aa.length!=0){
location.href="${pageContext.request.contextPath}/person/deletePersons.do?pids="+aa;
//$.post("url","array="+array,function(){},"json");
}else{
alert("請選擇要刪除的數據");
}
});
});
</script>
</head>
<body>
<input type="button" value="導出" id="b" />
<input type="button" value="刪除" id="c" />
<br><br>
<form action="${pageContext.request.contextPath }/person/selectLike.do">
pname:<input type="text" name="pname" /><br>
phone:<input type="text" name="phone" /><br>
<input type="text" name="uid" value="${user.id }" /><br>
<input type="submit" value="搜索" /><br>
</form>
<table border="2">
<tr>
<td><input type="checkbox" id="a" /></td>
<td>pid</td>
<td>pname</td>
<td>phone</td>
<td>address</td>
<td>pemail</td>
<td>pbirthday</td>
<td>操作</td>
</tr>
<c:forEach items="${list }" var="one">
<tr>
<td><input type="checkbox" name="items" value="${one.pid }" /></td>
<td>${one.pid }</td>
<td>${one.pname }</td>
<td>${one.phone }</td>
<td>${one.address }</td>
<td>${one.pemail }</td>
<td><f:formatDate value="${one.pbirthday}" pattern="yyyy-MM-dd" /></td>
<td><input type="button" value="刪除" class="delete" /> <a href="${pageContext.request.contextPath }/insert.jsp">點擊添加</a>
</td>
</tr>
</c:forEach>
</table>
每頁顯示:<select>
<option>4</option>
<option>6</option>
<option>8</option>
<option>10</option>
</select>
<a href="" >首頁</a>
<a href="" >1</a>
<a href="" >2</a>
<a href="" >3</a>
<a href="" >4</a>
<a href="" >5</a>
<a href="" >末頁</a>
跳轉到:<select>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
</select>頁
</body>
---------------------login.jsp-------------
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(function(){
$("#username").blur(function(){
var name=$(this).val();
$("#sname").empty();
if(name==null || name==""){
$(this).after("<span id='sname'><font color='red'>用戶名不能爲空!</font></span>");
name_flag=false;
}else{
name_flag=true;
}
});
$("#password").blur(function(){
var password=$(this).val();
$("#spassword").empty();
if(password==null || password==""){
$(this).after("<span id='spassword'><font color='red'>密碼不能爲空!</font></span>");
password_flag=false;
}else{
password_flag=true;
}
});
$("#login").click(function(){
if(name_flag&&password_flag){
$.post("${pageContext.request.contextPath }/user/login.do",$("form").serialize(),
function(d){
if(d=="ok"){
location.href="${pageContext.request.contextPath }/person/selectByUsersId.do";
}else{
$("span").empty();
$("#error").text("用戶名或密碼錯誤!");
}
},"json"
);
}else{
alert("請填寫登錄信息!");
}
});
});
</script>
</head>
<body>
<form action="${pageContext.request.contextPath }/user/login.do">
username:<input type="text" name="username" id="username" /><br>
password:<input type="password" name="password" id="password" /><br>
<input type="button" value="登錄" id="login"/><br/><br/>
<a href="reg.jsp"><span>還沒註冊?請註冊!</span></a>
</form>
</body>
</html>
--------------------Mapper接口---------------------------------------------
/**
*
*/
package cn.itcast.dao;
import java.util.List;
import cn.itcast.pojo.Person;
public interface PersonMapper {
public Person selectById(int pid);
public List<Person> selectByUsersId(int uid);
public List<Person> selectLike(Person p);
public void insertPerson(Person p);
public void deletePersons(String pids);
public Person update(Person p);
}
---------
/**
*
*/
package cn.itcast.dao;
import java.util.List;
import cn.itcast.pojo.Person;
import cn.itcast.pojo.User;
public interface UserMapper {
public void insertUsers(User user);
public User selectByName(String username);
}
=================mapper.xml====================================
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapper
PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
"http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="cn.itcast.dao.PersonMapper">
<insert id="insertPerson" parameterType="person">
insert into person(pname,phone,pbirthday,address,pemail,uid)values(#{pname},#{phone},#{pbirthday},#{address},#{pemail},#{uid});
</insert>
<update id="update" parameterType="person">
update person set pname=#{pname},
phone=#{phone},pbirthday=#{pbirthday},address=#{address},pemail=#{pemail}
where pid=#{pid}
</update>
<select id="selectLike" parameterType="person" resultType="person">
select * from person
<where>
uid=#{uid}
<if test="pname!='' and pname!=null">
and pname=#{pname}
</if>
<if test="phone!='' and phone!=null">
and phone=#{phone}
</if>
</where>
</select>
<delete id="deletePersons" parameterType="person" >
delete from person where pid in (${value})
</delete>
<select id="selectById" parameterType="int" resultType="person">
select * from person where pid=#{pid}
</select>
<select id="selectByUsersId" parameterType="int" resultType="person">
select * from person where uid=#{uid}
</select>
</mapper>
-------------------------------------------------------------------------------
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapper
PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
"http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="cn.itcast.dao.UserMapper">
<select id="selectByName" parameterType="String" resultType="User">
select * from user where username=#{username}
</select>
<insert id="insertUsers" parameterType="User">
insert into user(username,password,birthday,gender,email)values(#{username},#{password},#{birthday},#{gender},#{email});
</insert>
</mapper>
----------------------------------Controller類-----------------------------------------
/**
*
*/
package cn.itcast.controller;
import java.util.List;
import javax.servlet.http.HttpSession;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import cn.itcast.dao.PersonMapper;
import cn.itcast.pojo.Person;
import cn.itcast.pojo.User;
import cn.itcast.service.PersonService;
/** testPerson
*
*/
@Controller
@RequestMapping("person")
public class TestPerson {
@Autowired
private PersonService service;
@RequestMapping("selectByUsersId")
public String selectByUsersId(HttpSession session,Model model){
User user =(User) session.getAttribute("user");
List<Person> list = service.selectByUsersId(user.getId());
model.addAttribute("list",list);
return "list";
}
@RequestMapping("insertPerson")
public String insertPerson(HttpSession session,Person p){
User user =(User) session.getAttribute("user");
service.insertPerson(p);
return "redirect:/person/selectByUsers.do";
};
@RequestMapping("selectByUsers")
public String selectByUsers(HttpSession session,Model model){
int id = (int)session.getAttribute("uid");
List<Person> list = service.selectByUsersId(id);
model.addAttribute("list",list);
return "list";
}
@RequestMapping("selectById")
public String selectById(HttpSession session,int pid){
Person person = service.selectById(pid);
session.setAttribute("person",person);
return "update";
};
@RequestMapping("update")
public String update(HttpSession session,Person p){
Person person = service.update(p);
return "redirect:selectByUsersId.do";
};
@RequestMapping("selectLike")
public String selectLike(Person p,Model model){
List<Person> list = service.selectLike(p);
model.addAttribute("list",list);
return "list";
};
@RequestMapping("deletePersons")
public String deletePersons(String pids){
service.deletePersons(pids);
return "redirect:selectByUsersId.do";
};
}
-------------------------------------
/**
*
*/
package cn.itcast.controller;
import java.io.IOException;
import java.util.List;
import javax.jms.Session;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import com.google.code.kaptcha.servlet.KaptchaExtend;
import cn.itcast.pojo.Person;
import cn.itcast.pojo.User;
import cn.itcast.service.UserService;
@Controller
@RequestMapping("user")
public class TestUsers {
@Autowired
private UserService service;
@Autowired
private KaptchaExtend ke;
@RequestMapping("ke")
public String kaptcha(HttpServletRequest req, HttpServletResponse resp,
HttpSession s) throws ServletException, IOException {
ke.captcha(req, resp);
System.out.println("code:" + s.getAttribute("code"));
return null;
}
@RequestMapping("test")
@ResponseBody
public String test(HttpServletRequest req, HttpServletResponse resp,
HttpSession s, String code) throws ServletException, IOException {
if (s.getAttribute("code").equals(code)) {
return "ok";
}
return "error";
}
@Autowired
private UserService us;
@ResponseBody
@RequestMapping("login")
public String login(User user,HttpSession session){
try {
user = us.login(user);
session.setAttribute("user", user);
return "ok";
} catch (Exception e) {
return "error";
}
}
@RequestMapping("insertUsers")
@ResponseBody
public String insertUsers(User user){
try {
us.insertUsers(user);
return "ok";
} catch (Exception e) {
return "error";
}
}
@RequestMapping("isExist")
@ResponseBody
public String isExist(User user){
if(us.isExist(user.getUsername())){
return "error";
}else{
return "ok";
}
}
}
------------------------------攔截器-----------------------
/**
*
*/
package cn.itcast.converter;
import java.text.ParseException;
import java.text.SimpleDateFormat;
import java.util.Date;
import org.springframework.core.convert.converter.Converter;
public class DateConverter implements Converter<String, Date>{
/*
*日期類型格式轉換器
*/
@Override
public Date convert(String str) {
try {
SimpleDateFormat simpleDateFormat = new SimpleDateFormat("yyyy-MM-dd");
Date parse = simpleDateFormat.parse(str);
return parse;
} catch (ParseException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return null;
}
}