ssm项目（一）

末蓝、 2022-05-06 10:58 224阅读 0赞

### 前言：前段时间将ssm整合做完一个ssm项目，今天全部复盘一下。 ###

# ssm项目---》比较适合新手整合 #

## 一：项目分两个模块 ##

### 1.用户的curd,批量操作，分页操作 ###

涉及到的技术：SpringMVC,mybatis,Spring,Mysql

SpringMVC框架：负责编写Controller层，同时与前端页面进行数据交互。

mybatis框架：负责mysql数据的curd

Spring框架：核心的功能就是提供IOC容器,DI注入，事务管理。

成品如下：

![70][]

### 2.用户的登录，注册 ###

涉及到的技术ajax，jQuery

ajax：负责表单的异步提交，进行数据验证。

jQuery:该项目中主要的功能运用DOM编程来选取标签对象，获取值/设置值。

成品如下：

![70 1][]

这个页面要实现的功能，ajax异步数据验证进行用户名/密码判空，判重。

![70 2][]

这个页面要的功能：图片的ajax提交回显，各个输入框的数值判断。

将各个配置文件配置好，将各个包创建好，项目结构如下

![70 3][]

OK！！！Let's do it！！！

## 二：项目的Dao层编写 ##

首先看一下，我们的用户user有四个属性：id,name,age,birth,birthStr(用来保存String的Date)

先创建pojo

public class user {
    	private Serializable id;
    	private String name;
    	private int age;
    	private Date birth;
    	//Date的数据如不做如何处理是这样的：Sat Oct 13 19:03:00 CST 2018
    	//不是我们所要的，所以多写个属性保存处理之后的Date数据
    	private String birthStr; 
        //get..set略去
    }

OHOHO,这里说一下，因为pojo内涉及Date数据类型，SpringMVC无法自动转换，需要自定义converter，

不会看这里：[https://mp.csdn.net/postedit/83017319][https_mp.csdn.net_postedit_83017319]

然后创建userDao接口,以及userDao.xml映射文件

![70 4][]

userDao

public interface userDao {
    	//保存一个
    	public void save(user user);
    	//根据id查询一个
    	public user findById(Serializable id);
    	//根据id删除一个
    	public void deleteById(Serializable id);
    	//更新一名用户
    	public void update(user user);
    	//查询所有用户
    	public List<user> findAll();
    	//根据名称来查询
    	public user findByName(String name);
    	//根据id集合来删除
    	public void deleteByList(@Param("array")String[] idlist);
    }

userDao.xml中进行sql映射

<?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE mapper PUBLIC "-//mybatis.org/DTD Mapper 3.0" 
    			"http://mybatis.org/dtd/mybatis-3-mapper.dtd">
    <mapper namespace="dao.userDao">
    
    	<delete id="deleteByList" parameterType="java.lang.String">
    		delete from t_user where id in 
    		<foreach collection="array" item="id" open="(" separator="," close=")">
    			#{id}
    		</foreach>
    	</delete>
    
    	<select id="findByName" resultType="bean.user">
    	select * from t_user where name=#{name} 		
    	</select>
    
    	<select id="findAll" resultType="bean.user">
    	select * from t_user
    	</select>		
    		
    	<insert id="save">
    	insert into t_user values(null,#{name},#{age},#{birth})
    	</insert>
    	
    	<select id="findById" resultType="bean.user">
    	select * from t_user where id=#{id}
    	</select>
    	
    	<update id="update">
    	update t_user set name=#{name},age=#{age},birth=#{birth} where id=#{id}
    	</update>
    	
    	<delete id="deleteById">
    	delete from t_user where id=#{id}
    	</delete>
    	
    </mapper>

ok，Dao就编写好了。

## 三：项目Service层的编写 ##

这一层比较简单，在Service包，serviceImpl包中将操作进行包装

![70 5][]

UserService

public interface UserService {
    	//保存一个
    	public void save(user user);
    	//根据id查询一个
    	public user findById(Serializable id);
    	//根据id删除一个
    	public void deleteById(Serializable id);
    	//更新一名用户
    	public void update(user user);
    	//查询所有用户
    	public List<user> findAll();
    	//根据名字查询
    	public user findByName(String name);
    	//根据集合id删除
    	public void deleteByArr(String[] list) ;
    }

UserServiceImpl

@Service
    public class UserServiceImpl implements UserService {
    	@Resource
    	private userDao userDao;
    
    	@Override
    	public user findById(Serializable id) {
    		user user = userDao.findById(id);
    		if(user.getBirth()!=null) {
    			user.setBirthStr(new SimpleDateFormat("yyyy-MM-dd").format(user.getBirth()));
    		}
    		return user;
    	}
    
    	@Override
    	public void save(user user) {
    		userDao.save(user);
    	}
    
    	@Override
    	public void deleteById(Serializable id) {
    		userDao.deleteById(id);
    	}
    
    	@Override
    	public void update(user user) {
    		userDao.update(user);
    	}
    
    	@Override
    	public List<user> findAll() {
    		List<user> list = userDao.findAll();
    		for (user user : list) {
    			user.setBirthStr(new SimpleDateFormat("yyyy-MM-dd").format(user.getBirth()));
    		}
    		return list;
    	}
    
    
    	@Override
    	public user findByName(String name) {
    		return userDao.findByName(name);
    	}
    
    	@Override
    	public void deleteByArr(String[] list) {
    		userDao.deleteByList(list);
    	}
    
    }

OK,Service层写好了

## 四：项目的view层编写 ##

主要涉及的jsp页面，主页（index.jsp），添加页面add.jsp，修改页面update.jsp

index.jsp

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Insert title here</title>
    <script type="text/javascript" src="js/jquery-3.3.1.js"></script>
    <script type="text/javascript">
    	function deleteItems() {
            //ajax是对多选框的判断，数值的获取，提交。
    		var checkedNum = $("input[name='delete_id']:checked").length;
    		alert(checkedNum);
    		if(checkedNum==0){
    			alert("至少选择一条数据");
    			return false;
    		}
    		if(confirm("确认删除所选择的数据")){
                var checkedList = new Array();
                $("input[name='delete_id']:checked").each(function(){
                    checkedList.push($(this).val());
                });
                $.ajax({
                    type:"POST",
                    url:"deleteItems",
                    data:{"delitems":checkedList.toString()},
                    datatype:"html",
                    success:function(data){
                    	alert("成功");
                    },
                    error:function(data){
                        art.dialog.tips('删除失败!');
                    }
                });
    
    		}
    	}
    </script>
    </head>
    <body>
    	欢迎
    	<br>
    	<a href="login.jsp">退回登入</a>
    	<div style="color: red">
    		<a href="add.jsp">添加用户</a> <input type="button" value="批量删除"
    			onclick="deleteItems()">
    	</div>
    	<form action="turnPage" method="get">
    		<table align="center" bordercolor="red" border="1">
    			<tr>
    				<th colspan="6">用户表</th>
    			</tr>
    			<tr>
    				<td>批量操作</td>
    				<td>用户编号</td>
    				<td>用户名称</td>
    				<td>用户年龄</td>
    				<td>用户出生</td>
    				<td>操作</td>
    			</tr>
    			<c:forEach items="${users }" var="user">
    				<tr>
    					<td><input type="checkbox" id="delete_id" name="delete_id"
    						value="${user.id }"></td>
    					<td>${user.id }</td>
    					<td>${user.name }</td>
    					<td>${user.age }</td>
    					<td>${user.birthStr }</td>
    					<td><a
    						href="findById">修改</a>
    						<a href="delete?id=${user.id }">删除</a></td>
    				</tr>
    			</c:forEach>
    		
    		</table>
    	</form>
    </body>
    </html>

update.jsp

### 修改的页面：点击修改--》fingById()方法--》再来当update页面的默认值 ###

<body>
    	欢迎来到修改页面，${findById.name }
    	<form action="update" method=post>
    		<table border="2" align="center">
    			<tr>
    				<th colspan="2">修改表</th>
    			</tr>
    			<tr>
    				<td>用户编号</td>
    				<td><input type="text" value="${findById.id }" name="id"
    					readonly="readonly"></td>
    			</tr>
    			<tr>
    				<td>用户名称</td>
    				<td><input type="text" value="${findById.name }" name="name"></td>
    			</tr>
    			<tr>
    				<td>用户年龄</td>
    				<td><input type="text" value="${findById.age }" name="age"></td>
    			</tr>
    			<tr>	
    				<td>出生年月</td>
    				<td><input type="text" value="${findById.birthStr }" name="birth"></td>
    			</tr>
    			<tr>
    				<td colspan="2" align="center"><input type="submit" value="提交"></td>
    			</tr>
    		</table>
    	</form>
    </body>

add.jsp

<body>
    欢迎来到添加页面
    <form action="add" method="post">
    	<table align="center">
    		<tr>	
    			<th colspan="2">添加用户表格</th>
    		</tr>
    		<tr>
    			<td>用户名：</td>
    			<td><input type="text" name="name"></td>
    		</tr>
    		<tr>
    			<td>年龄：</td>
    			<td><input type="text" name="age"></td>
    		</tr>
    		<tr>
    			<td>出生年月</td>
    			<td><input type="text" name="birth"></td>
    		</tr>
    		<tr>
    			<td colspan="2" align="center"><input type="submit" value="提交"></td>
    		</tr>
    	</table>
    </form>

五：项目Controller层的编写

@Controller
    public class userController {
    	@Autowired
    	private UserService UserServiceImpl;
    	
    
    	@RequestMapping(value = "/deleteItems")
    	public String deleteItems(HttpServletRequest request,String delitems) {
    		String[] idlist = delitems.split(",");
    		UserServiceImpl.deleteByArr(idlist);
    		return "redirect:/main";
    	}
    
    	@RequestMapping(value = "main")
    	public String main(Model model) {
    		model.addAttribute("users", UserServiceImpl.findByPager(pager));
    		return "jsp/index";
    	}
    
    
    
    	@RequestMapping(value = "add")
    	public String add(user user) {
    		UserServiceImpl.save(user);
    		return "redirect:/main";
    	}
    
    	@RequestMapping(value = "delete")
    	public String delete(String id) {
    		UserServiceImpl.deleteById(id);
    		return "redirect:/main";
    	}
    
    
    	@RequestMapping(value = "/findById")
    	public String findById(@Param("id") String id, Model model) {
    		model.addAttribute("findById", UserServiceImpl.findById(id));
    		return "jsp/update";
    	}
    
    	@RequestMapping(value = "/update")
    	public String update(Model model, user user) {
    		UserServiceImpl.update(user);
    		return "redirect:/turnPage";
    	}
    }

OK,Dao层，Controller层，view层，service层编写好了，就可以进行简单的curd。

下篇写分页功能的添加。

[70]: /images/20220506/d0434acbfc304d3f9386c37d66c479bb.png
[70 1]: /images/20220506/85b8397699cd4613b9df41e32f37e9dc.png
[70 2]: /images/20220506/acf6bdd53af3467cbc2160b85cc6d498.png
[70 3]: /images/20220506/cc2082e4c076444e9bc7907d175cd037.png
[https_mp.csdn.net_postedit_83017319]: https://mp.csdn.net/postedit/83017319
[70 4]: /images/20220506/5f8f80ddc5844dd5a8afe43aebaed185.png
[70 5]: /images/20220506/d72599c5877049a3ae5bd2fb2e6df631.png