SpringMVC+hibernate+Mysql环境搭建（二）-优快云博客

本文介绍了使用SpringMVC框架实现的学生信息管理系统的搭建过程，包括表现层的两个关键页面：添加学生信息页面(student_add.jsp)及展示学生列表页面(student.jsp)的详细代码。该系统实现了学生信息的增删查等功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

2019独角兽企业重金招聘Python工程师标准>>>

（5）后台代码基本写完了，现在开始写表现层，表现层放在/WEB-INF/view目录下，

主要有student_add.jsp和student.jsp页面

student_add.jsp页面源码如下：

 <%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
<script type="text/javascript"><!--   
function turnback(){   
    window.location.href="<%=request.getContextPath() %>/student.do";   
}   
// --></script> 
</head>
<body>
<form method="post" action="<%=request.getContextPath() %>/student.do?method=save">  
       <div><c:out value="${addstate}"></c:out></div>  
       <table>  
           <tr><td>姓名</td><td><input id="name" name="name" type="text" /></td></tr>  
           <tr><td>密码</td><td><input id="psw" name="psw"  type="text" /></td></tr>  
           <tr><td colSpan="2" align="center"><input type="submit" value="提交"/>
           <input type="button" onclick="turnback()" value="返回" /> </td></tr>  
       </table>  
</form>  
</body>
</html>

student.jsp页面的源码如下：

<%@ page language="java" contentType="text/html; charset=UTF-8"  
    pageEncoding="UTF-8"%>  
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>  
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
<html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
<title>添加</title>  
<script language="javascript" src="<%=request.getContextPath()%>/style/jquery-1.8.0.min.js"></script>  
<style>
<!--   
table{  border-collapse:collapse;  }   
td{  border:1px solid #f00;  }   
-->
</style>
<style mce_bogus="1">
table{  border-collapse:collapse;  }   
td{  border:1px solid #f00;  }
</style>  
<script type="text/javascript">
<!--   
function add(){   
    window.location.href="<%=request.getContextPath() %>/student.do?method=add";   
}   
  
function del(id){   
$.ajax( {   
    type : "POST",   
    url : "<%=request.getContextPath()%>/student.do?method=del&id=" + id,   
    dataType: "json",   
    success : function(data) {   
        if(data.del == "true"){   
            alert("您确定删除么！");   
            $("#" + id).remove();   
        }   
        else{   
            alert("删除失败！");   
        }   
    },   
    error :function(){   
        alert("网络连接出错！");   
    }   
});   
}   
// --></script>  
</head>  
<body>  
  
<input id="add" type="button" onclick="add()" value="添加"/>  
<table >  
    <tr>  
        <td>序号</td>  
        <td>姓名</td>  
        <td>密码</td>  
        <td>操作</td>  
    </tr>  
    <c:forEach items="${list}" var="student">  
    <tr id="<c:out value="${student.id}"/>">  
        <td><c:out value="${student.id}"/></td>  
        <td><c:out value="${student.name}"/></td>  
        <td><c:out value="${student.psw}"/></td>  
        <td>  
            <input type="button" value="编辑"/>        
            <input type="button" onclick="del('<c:out value="${student.id}"/>')" value="删除"/>  
        </td>  
    </tr>  
    </c:forEach>  
       
</table>  
</body>  
</html>

index.jsp

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<script type="text/javascript">   
function turnback(){   
    window.location.href="<%=request.getContextPath() %>/student.do";   
}   
</script> 
</head>
<body>
       这是一个springMVC，我们来开始添加学生等。
       <form action="student.do">
           <input type="hidden" name="method" value="add" />
           <input type="submit" name="button" value="添加" />
       </form>
       <input type="button" onclick="turnback()" value="列表" /> </td></tr>  
</body>
</html>

这里我们把初始页面写在了index.jsp中，也可以按我文档结构截图所示的把上面的index.jsp的代码写到Home.jsp里

只需让index.jsp中写入如下代码

 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>

</head>
<body>
        <jsp:forward page="WEB-INF/View/test/Home.jsp"/>
</body>
</html>

以上即完成了所有搭建、测试例代码

最后附录数据库截图

h3c库中建立student表