一、环境的搭建
1、导包
导包2、导入工具库
本案例使用的工具类是之前用过的JDBCUtils。
import java.sql.Connection;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;
import javax.sql.DataSource;
import com.mchange.v2.c3p0.ComboPooledDataSource;
public class JDBCUtils {
// 创建一个连接池:但是这个连接池只需要创建一次即可。
private static final ComboPooledDataSource dataSource = new ComboPooledDataSource();
/**
* 获得连接的方法
* @throws SQLException
*/
public static Connection getConnection() throws SQLException{
return dataSource.getConnection();
}
/**
* 获得数据源:
*/
public static DataSource getDataSource(){
return dataSource;
}
}
3、创建数据库和表
打开mysql数据库,创建数据库和表,并添加一些记录。
use ajax_test;
create table student(
sid int primary key auto_increment,
sname varchar(20),
gender varchar(10),
age int
);
insert into student(sname,gender,age) values ('zhangsan','male',18);
insert into student(sname,gender,age) values ('lisi','male',20);
insert into student(sname,gender,age) values ('wangwu','male',22);
insert into student(sname,gender,age) values ('zhaoliu','male',18);
数据库
4、导入并修改配置文件
导入配置文件配置文件
二、实现案例
1、创建JavaBean
public class Student {
private Integer sid;
private String sname;
private String gender;
private int age;
public Student() {
super();
// TODO Auto-generated constructor stub
}
public Student(Integer sid, String sname, String gender, int age) {
super();
this.sid = sid;
this.sname = sname;
this.gender = gender;
this.age = age;
}
public Integer getSid() {
return sid;
}
public void setSid(Integer sid) {
this.sid = sid;
}
public String getSname() {
return sname;
}
public void setSname(String sname) {
this.sname = sname;
}
public String getGender() {
return gender;
}
public void setGender(String gender) {
this.gender = gender;
}
public int getAge() {
return age;
}
public void setAge(int age) {
this.age = age;
}
}
2、实现StudentServlet
import java.io.IOException;
import java.io.PrintWriter;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import com.itheima.domain.Student;
import com.itheima.service.StudentService;
public class StudentServlet extends HttpServlet {
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//获取输出流对象
PrintWriter out = response.getWriter();
//获取所有的学生数据
StudentService service = new StudentService();
List<Student> list = service.findAll();
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
doGet(request, response);
}
}
3、实现StudentService
import java.util.List;
import com.itheima.dao.StudentDao;
import com.itheima.domain.Student;
public class StudentService {
public List<Student> findAll() {
StudentDao dao = new StudentDao();
return dao.finAll();
}
}
4、实现StudentDao
package com.itheima.dao;
import java.sql.SQLException;
import java.util.List;
import org.apache.commons.dbutils.QueryRunner;
import org.apache.commons.dbutils.handlers.BeanListHandler;
import com.itheima.domain.Student;
import com.itheima.utils.JDBCUtils;
public class StudentDao {
public List<Student> finAll() {
List<Student> list = null;
//获取
QueryRunner qr = new QueryRunner(JDBCUtils.getDataSource());
//查询学生信息
try {
list = qr.query("select * from student", new BeanListHandler<Student>(Student.class));
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return list;
}
}
5、完善StudentServlet
import java.io.IOException;
import java.io.PrintWriter;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import com.itheima.domain.Student;
import com.itheima.service.StudentService;
public class StudentServlet extends HttpServlet {
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//获取输出流对象
PrintWriter out = response.getWriter();
//获取所有的学生数据
StudentService service = new StudentService();
List<Student> list = service.findAll();
if(list != null){
//将学生信息进行拼接
StringBuilder sb = new StringBuilder();
for (Student student : list) {
sb.append("<tr>");
sb.append("<td>"+student.getSname()+"</td>");
sb.append("<td>"+student.getGender()+"</td>");
sb.append("<td>"+student.getAge()+"</td>");
sb.append("</tr>");
}
//返回响应信息
out.println(sb.toString());
}
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
doGet(request, response);
}
}
6、创建HTML页面,展示学生信息
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
<script type="text/javascript">
$(function(){
$.ajax({
type:"GET",
url:"/web14_test3/StudentServlet",
success:function(msg){
$("table").append(msg);
}
});
});
</script>
</head>
<body>
<table border="1" width="500">
<tr>
<td>姓名</td>
<td>性别</td>
<td>年龄</td>
</tr>
</table>
</body>
</html>
7、案例实现结果
学生信息三、使用JSON改写案例
JSON是一种轻量级的数据交互(传输)格式,我们收发数据都可以使用这种格式,但要注意必须使用同样的格式。
jQuery的AJAX接收数据的格式:
普通文本
xml:表示一个对象需要使用许多的标签
json:表示一个对象可以通过js对象表示:
{username:"zhangsan",age:18}
表示多个对象:
[{name:"zhangsan",age:18},{name:"lisi",age:18}]
json的使用方式:
ajax方法:
在参数js对象中设置dataType属性。
{
dataType:"json"
}
get方法:
两个参数变三个参数:url,fn,"json"
三个参数变四个参数:url,data,fn,"json"
post方法:
两个参数变三个参数:url,fn,"json"
三个参数变四个参数:url,data,fn,"json"
1、导入与json有关的jar包
使用JSON的相关jar包,下载链接: https://pan.baidu.com/s/1POt2rbbZ4-OuPNl3ZUuTfQ 密码: djyp
2、实现StudentJSONServlet
package com.itheima.service;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import com.itheima.domain.Student;
import net.sf.json.JSONArray;
public class StudentJSONServlet extends HttpServlet {
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//获取输出流对象
PrintWriter out = response.getWriter();
//获取所有的学生对象
StudentService service = new StudentService();
List<Student> list = service.findAll();
if(list != null){
//这里需要使用jsonlib中的两个类
//JSONArray 可以将数组、List转换成json格式的数据
//JSONObject 可以将对象、Map转换成json格式的数据
JSONArray jsonArray = JSONArray.fromObject(list);
out.println(jsonArray.toString());
}
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
doGet(request, response);
}
}
3、创建studentJSON.html页面
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
<script type="text/javascript">
$(function(){
$.ajax({
type:"GET",
dataType:"json",
url:"/web14_test3/StudentJSONServlet",
success:function(data){
$(data).each(function(){
var s = "<tr><td>"+this.sname+"</td><td>"+this.gender+"</td><td>"+this.age+"</td></tr>"
$("table").append(s);
});
}
});
});
</script>
</head>
<body>
<table border="1" width="500">
<tr>
<td>姓名</td>
<td>性别</td>
<td>年龄</td>
</tr>
</table>
</body>
</html>
网友评论