JSON簡介:
JSON: JavaScript Object Notation(JavaScript 對象表示法)
JSON 是存儲和交換文本信息的語法。類似 XML。
JSON 比 XML 更小、更快,更易解析。
JSON 文本格式在語法上與創建 JavaScript 對象的代碼相同。
由於這種相似性,無需解析器,JavaScript 程序能夠使用內建的 eval() 函數,用 JSON 數據來生成原生的 JavaScript 對象。
1.新建一個實體類(student).
public class Student {
private int number;
private String name;
private String address;
public Student(){}
public Student(int number, String name, String address) {
this.number = number;
this.name = name;
this.address = address;
}
public int getNumber() {
return number;
}
public void setNumber(int number) {
this.number = number;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getAddress() {
return address;
}
public void setAddress(String address) {
this.address = address;
};
}
2.新建Dao接口,給出兩個方法(向數據庫添加數據和取出數據)。
import java.util.List;
import org.json.JSONObject;
public interface Dao {
public boolean insertDate(Student stu);
public List<JSONObject> selectAll();
}
3.實現兩個方法
import java.sql.Connection;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import org.json.JSONObject;
import cn.com.yong.Dao.Dao;
import cn.com.yong.Util.DBConnection;
public class Student implements Dao {
@Override
public boolean insertDate(cn.com.yong.pro.Student stu) {
Connection con=DBConnection.getDBConnectionInstance().getDBConnection();
String sql="insert into student (number,name,address) value(?,?,?)";
try {
java.sql.PreparedStatement ps=con.prepareStatement(sql);
ps.setInt(1, stu.getNumber());
ps.setString(2, stu.getName());
ps.setString(3, stu.getAddress());
int i=ps.executeUpdate();
if(i>0){
return true;
}
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return false;
}
@Override
public List<JSONObject> selectAll() {
Connection con=DBConnection.getDBConnectionInstance().getDBConnection();
List<JSONObject> list=new ArrayList<JSONObject>();
String sql="select number,name,address from student";
try {
ResultSet rs=con.createStatement().executeQuery(sql);
while(rs.next()){
Map<String, Object> map=new HashMap<String, Object>();
map.put("number", rs.getInt(1));
map.put("name",rs.getString(2));
map.put("address", rs.getString(3));
list.add(new JSONObject(map));
}
} catch (SQLException e) {
e.printStackTrace();
}
return list;
}
}
4.新建用於表單提交的html文件(為方便提交和獲取放在一塊)。
<!DOCTYPE html>
<html>
<head>
<title>show3.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<script type="text/javascript" src="js/student3.js"></script>
</head>
<body>
<!-- json表單注冊 -->>
<form action="" method="post"></form>
編號:<input type="text" name="number" id="number"/><br>
姓名:<input type="text" name="name" id="name"/><br>
住址:<input type="text" name="address" id="address"/><br>
<input type="button" value="提交" onclick="insertStu()"/>
</form>
<!-- 讀取數據 -->
<input type="button" onclick="insertStu()" value="獲取信息">
<table border="1px" width="100%" align="center">
<thead><tr>
<th>學號</th>
<th>姓名</th>
<th>住址</th>
</tr></thead>
<tbody id="main" align="center">
</tbody>
</table>
</body>
</html>
5.新建js文件
//瀏覽器協議
var xmlHttp;
function creatXMLHttpRequest(){
if(window.XMLHttpRequest){
xmlHttp=new XMLHttpRequest();
}else if(window.ActiveXObject){
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
//觸發函數
function insertStu(){
//向瀏覽器發出異步請求
creatXMLHttpRequest();
//獲取表單數據
var number=document.getElementById("number").value;
var name=document.getElementById("name").value;
var address=document.getElementById("address").value;
//若將多個表單數據轉換成json格式,前提先把這些數據存儲到js的對象中
var jsObject=new fromObject(number,name,address);
//將對象轉換成JSON格式的數據
json=JSON.stringify(jsObject);
alert(json);
//開啟對服務器端的連接
var url="insertServlet";
xmlHttp.open("post", url, true);
//向服務器發送請求,將json格式的數據傳輸到servlet中
xmlHttp.send(json);
//回調匿名函數,接受服務器傳來的數據
xmlHttp.onreadystatechange=function (){
//判斷服務器響應狀態和請求狀態 200表示響應ok 4表示請求完成
alert("1");
if(xmlHttp.status==200 && xmlHttp.readyState==4){
var msg=xmlHttp.responseText;
//javascript能夠使用內置的eval()函數生成javascript對象
var stus=eval("("+msg+")");
tbody=document.getElementById("main");
for ( var i = 0; i < stus.length; i++) {
var stu = stus[i];
alert(stu.name);
var tr=document.createElement("tr");
var td1=document.createElement("td");
td1.innerHTML=stu.number;
//td1.appendChild(document.createTextNode(stu.number));
tr.appendChild(td1);
var td2=document.createElement("td");
//td2.appendChild(document.createTextNode(stu.name));
td2.innerHTML=stu.name;
tr.appendChild(td2);
var td3=document.createElement("td");
//td3.appendChild(document.createTextNode(stu.address));
td3.innerHTML=stu.address;
tr.appendChild(td3);
tbody.appendChild(tr);
}
}
};
}
//相當於我們的實體類,轉化js對象時調用
function fromObject(number,name,address){
this.number=number;
this.name=name;
this.address=address;
}
6.Servlet
import java.io.BufferedReader;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;
import cn.com.yong.ImplementDao.Student;
@WebServlet("/insertServlet")
public class insertServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doPost(request, response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
System.out.println("-----------");
request.setCharacterEncoding("UTF-8");
//創建帶有緩沖區的字符串對象jsn,用來存儲讀取到的json
StringBuffer jsn=new StringBuffer();
//用io流的方式讀取js頁面傳過來的對象json
BufferedReader br=request.getReader();
String line=null;
while((line=br.readLine())!=null){
jsn.append(line);
}
//拆分json表單中的數據
try {
JSONObject jo=new JSONObject(jsn.toString());
int number=jo.getInt("number");
String name=jo.getString("name");
String address=jo.getString("address");
System.out.println(number+name+address);
cn.com.yong.pro.Student st=new cn.com.yong.pro.Student(number, name, address);
Student stu=new Student();
stu.insertDate(st);
} catch (JSONException e) {
e.printStackTrace();
}
System.out.println("-------------------------------------------------------");
Student stu=new Student();
List<JSONObject> list=stu.selectAll();
//轉換成jeson格式
JSONArray ja=new JSONArray(list);
System.out.println(ja.toString());
response.setCharacterEncoding("UTF-8");
response.setContentType("text/html;charset=UTF-8");
//以io流的方式返回
PrintWriter pw=response.getWriter();
pw.write(ja.toString());
pw.flush();
pw.close();
}
}
