SpringMVC+hibernate+Mysql环境搭建（二）

时间 2019-11-17

标签 springmvc+hibernate+mysql springmvc hibernate mysql 环境搭建栏目 Spring 繁體版

原文原文链接

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

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

student_add.jsp页面源码以下：java

 <%@ 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页面的源码以下：jquery

<%@ 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.jspajax

<%@ 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里spring

只需让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>

以上即完成了全部搭建、测试例代码json

最后附录数据库截图网络

h3c库中创建student表jsp