JSP和Servlet的区别;
servlet是在服务器端执行的java程序,只不过它有专门的一套规则(就是我们平常所说的api);jsp说得简单点就是用另一套简单的规则写的servlet程序,它可以写java代码,还可以写html代码,JavaScript,css等,但是到服务器端首先会被转成servlet程序然后就按照servlet的执行顺序执行了。
jsp一般用在数据的显示 ,Servlet用在数据的处理
jsp和servlet实现数据的添加与后台管理;
思路:1,使用html框架将页面组合起来;
2,在左边的数据添加和查询页面写成jsp和servlet
代码实现;
1,在Oracle中创建QQLine表和字段,并插入数据
1 ,创建
QQLine表
字段
no number(10), 编号
name varchar2(15), 姓名
phone number(11), 电话
qq number(13), qq号码
email varchar2(15) email
2, 插入两条数据
insert into QQLine values(2,'谢霆锋',15623453212,88888888,'feng@163.com');
insert into QQLine values(1,'谢',15623453212,777777788,'ting@qq.com');
2,在JavaEE工具中创建动态网站项目
2,1创建顶部html页面;
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h1>QQLine</h1>
</body>
</html>
2,2创建左边的导航页面, 点击数据显示在右边 ;关键代码
<div>
<h3>功能导航</h3>
<ul>
<li><a href="XS.jsp" target="_mainFrame">显示数据</a></li>
<li><a href="Reg.html" target="_mainFrame">添加数据</a></li>
</ul>
</div>
2,3 使用html框架将页面组合起来; 关键代码
<frameset rows="100px,*">
<frame src="Top.html" />
<frameset cols="200px,*">
<frame src="Left.html" />
<frame src="XS.jsp" name="_mainFrame" /> //name的属性是点击左边的导航数据会显示在右边
</frameset>
</frameset>
3,动态数据的处理;
3,1 点击左边的 查询数据库的数据显示在右边 XS.jsp;关键代码
<%@page import="sun.security.util.DerValue"%> <%@page import="java.sql.*"%> <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset=UTF-8> <title>Insert title here</title> </head> <body> <% try { //加载数据库驱动 Class.forName("oracle.jdbc.driver.OracleDriver"); String url = "jdbc:oracle:thin:@127.0.0.1:1521:orcl"; Connection conn = DriverManager.getConnection(url, "SCOTT", "tiger"); %> <!-- 设置表格显示数据 --> <table border=1px width=100%> <h3>联系人信息</h3> <tr> <th>编号</th> <th>姓名</th> <th>电话</th> <th>QQ</th> <th>Email</th> </tr> <% String sql="select * from QQLine order by no"; //System.out.println(sql); PreparedStatement pstm =conn.prepareStatement(sql); // System.out.println("======"); ResultSet rt =pstm.executeQuery(); //System.out.println("++++++"); while(rt.next()){ int no = rt.getInt(1); // String name= rt.getString(2); %> <tr> <td><%=no %></td> <td><%=rt.getString("name") %></td> <td><%=rt.getLong(3) %></td> <td><%=rt.getLong(4) %></td> <td><%=rt.getString(5) %></td> </tr> <% } %> </table> <% } catch (Exception ef) { ef.printStackTrace(); } %> </body> </html>
3,2点击左边导航栏中的数据添加,可以向数据库添加数据 ,使用serlvet来处理
添加数据的html关键代码;
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>添加数据</title>
<style type="text/css">
.float_right{
text-align:center;
color:#0000ff;
font-size:14px;
font-weight:bold;
}
form div{float:left;position:relative}
form input{float:left}
</style>
</head>
<body>
<h1>添加数据</h1>
<form action="save" method="post">
<table width=300px>
<tr class="float_right">
<td width=100px>id:</td>
<td><input type="text" name="userId" id="userId" οnblur="fun_id()"/>
<div id="innerid"> </div></td>
</tr>
<tr>
<td class="float_right"> name:</td>
<td><input type="text" name="userName" id="uesrName" />
<div id="innerctext"> </div></td>
</tr>
<tr>
<td class="float_right"> phone:</td>
<td><input type="text" name="uesrPhone" id="uesrPhone" />
<div id="innerclass"> </div></td>
</tr>
<tr>
<td class="float_right"> qq:</td>
<td><input type="text" name="uesrqq" id="userqq" />
<div id="innerqq"> </div></td>
</tr>
<tr>
<td class="float_right"> email:</td>
<td><input type="text" name="uesrEmail" id="userEmail" />
<div id="inneremail"> </div></td>
</tr>
<tr>
<td colspan="2" align="center"> <input type="reset" value="取消"> <input type="submit" value="添加"></td>
</tr>
</table>
</form>
</body>
</html>
数据库的单例模式;
package DB;
import java.sql.Connection;
import java.sql.DriverManager;
public class DB {
private static Connection conn =null;
private DB(){
}
public static Connection getConn(){
if (conn != null) {
return conn;
}
try{
Class.forName("oracle.jdbc.driver.OracleDriver");
String url = "jdbc:oracle:thin:@127.0.0.1:1521:orcl";
conn= DriverManager.getConnection(url,"SCOTT", "tiger");
return conn;
}catch(Exception e){
e.printStackTrace();
return null;
}
}
}
servlet获取数据并处理数据添加到数据库中并跳转到显示页面XS.jsp
package servlet;
import java.io.IOException;
import java.sql.Connection;
import java.sql.PreparedStatement;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import DB.DB;
/**
* 使用servlet保存post提交数据
* @author Administrator
*
*/
public class SaveTXL extends HttpServlet {
@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
String ids = request.getParameter("userId");
int no = Integer.parseInt(ids);
String name = request.getParameter("userName");
System.out.println(name);
String phones = request.getParameter("uesrPhone");
int phone = Integer.parseInt(phones);
String qqs = request.getParameter("uesrqq");
int qq = Integer.parseInt(qqs);
String email = request.getParameter("uesrEmail");
System.out.println(no+" "+ name+" "+phones+" "+qqs+" "+ email);
//连接数据库
try{
//创建数据库的连接
Connection conn = DB.getConn();
//sql语句
String sql ="insert into QQLine values(?,?,?,?,?)";
//预编译
PreparedStatement pstm = conn.prepareStatement(sql);
//赋值
pstm.setInt(1, no);
pstm.setString(2, name);
pstm.setInt(3,phone);
pstm.setInt(4,qq);
pstm.setString(5,email);
//
int len =pstm.executeUpdate();
System.out.println("受影响的行数:"+len);
}catch(Exception e){
e.printStackTrace();
}
request.getRequestDispatcher("XS.jsp").forward(request, response);
}
}
将 servlet在web.xml中配置
<servlet>
<servlet-name>Save</servlet-name>
<servlet-class>servlet.SaveTXL</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>Save</servlet-name>
<url-pattern>/save</url-pattern>
</servlet-mapping>