使用了SpringMVC框架的纯html的Ajax：
增删改查
使用Ajax的目的就是不想使用jsp的任何东西。至于是不是增删改查四个全用Ajax，实际上并不重要。纯html使用Ajax最重要的地方就在于全查，得到所有数据后会在Ajax的回调函数中使用JQuery中的each来遍历，这样就可以替代在jsp页面中可以使用标签遍历的优势了。
这是一个html页面。不是jsp页面。
在这里插入代码片
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="/My_SpringMVC-181122/js/jquery-3.2.1.min.js"></script>
<title>SpringMVC框架中的纯html的Ajax增删改查</title>
</head>
<body>
<section>
<form action="/My_SpringMVC-181122/createAllUser" method="post" id="form1">
<input type="text" name="username"/>姓名
<input type="text" name="userage"/> 年龄
<input type="radio" name="usergender" value="男" checked="checked"/>男
<input type="radio" name="usergender" value="女"/>女
<button type="button" id="btn2">添加</button>
<button form="form2" type="submit" id="btn3">批量删除</button>
</form>
</section>
<section>
<form id="form2" method="post" action="/My_SpringMVC-181122/deleteUsers">
<input type="hidden" id="hid01" name="user_id"/>
<table border="1">
<thead>
<tr>
<th><input type="checkbox" /></th><th>姓名</th><th>年龄</th><th>性别</th><th>操作</th>
</tr>
</thead>
<tbody id="tbodyId">
</tbody>
</table>
</form>
</section>
</body>
<script>
function update01(oA , user_id){ //直接在当前页面上 进行修改
$("#hid01").val(user_id);
var oTd2 = $(oA).parent().parent().children().eq(1);
var oTd3 = $(oA).parent().parent().children().eq(2);
var oTd4 = $(oA).parent().parent().children().eq(3);
var oTd5 = $(oA).parent().parent().children().eq(4);
oTd2.html("<input type='text' name='username' class='ipt1' value='"+oTd2.text()+"'/>");
oTd3.html("<input type='text' name='userage' class='ipt1' value='"+oTd3.text()+"'/>");
if(oTd4.text() == "男")
oTd4.html("<input type='radio' name='usergender' value='男' checked='checked'/>男 <input type='radio' name='usergender' value='女'/>女");
else
oTd4.html("<input type='radio' name='usergender' value='男'/>男 <input type='radio' name='usergender' value='女' checked='checked'/>女");
oTd5.html("<a href='javascript:;' onclick='update02();'>确定</a>");
}
function update02(){ //配合上面的修改方法一起用的
var oForm = $("#form2");
oForm.attr("action","/My_SpringMVC-181122/updateUser");
oForm.submit();
}
</script>
<script>
$(function(){//JQuery形式 的页面加载函数
$.ajax({//当这个页面一加载就会执行这个全查的Ajax
url:"/My_SpringMVC-181122/retrieveAllUser",
type:"post",
success:function(returnValue){//我使用了springMVC框架所支持的json的方式，非常方便
console.log(returnValue);//在浏览器的控制台上输出。可按下F12查看
$.each(returnValue,function(i,v){
var oTbody=$("#tbodyId");
var oTd0=$("<td><input type='checkbox' name='ids' id='selected-all' value='"+v.user_id+"'></td>");
var oTd1=$("<td>"+v.username+"</td>");
var oTd2=$("<td>"+v.userage+"</td>");
var oTd3=$("<td>"+v.usergender+"</td>");
var oTd4=$('<td><a href="javascript:;" onclick="update01(this,'+(v.user_id)+')" >编辑</a></td>');
var oTr2=$("<tr></tr>");
oTd0.appendTo(oTr2); //把各列添加到一行中
oTd1.appendTo(oTr2);
oTd2.appendTo(oTr2);
oTd3.appendTo(oTr2);
oTd4.appendTo(oTr2);
oTr2.appendTo(oTbody);
});
}
});
$("#btn2").click(function(){ //为添加按钮挂上事件
$("#form1").submit();
});
});
</script>
</html>
下面的是实体类
package com.oracle.pojo;
import java.io.Serializable;
@SuppressWarnings("serial")
public class UserPojo implements Serializable {
private Integer user_id;
private String username;
private Integer userage;
private String usergender;
public Integer getUser_id() {
return user_id;
}
public void setUser_id(Integer user_id) {
this.user_id = user_id;
}
public String getUsername() {
return username;
}
public void setUsername(String username) {
this.username = username;
}
public Integer getUserage() {
return userage;
}
public void setUserage(Integer userage) {
this.userage = userage;
}
public String getUsergender() {
return usergender;
}
public void setUsergender(String usergender) {
this.usergender = usergender;
}
public UserPojo() {
super();
// TODO Auto-generated constructor stub
}
public UserPojo(Integer user_id, String username, Integer userage, String usergender) {
super();
this.user_id = user_id;
this.username = username;
this.userage = userage;
this.usergender = usergender;
}
@Override
public String toString() {
return "UserPojo [user_id=" + user_id + ", username=" + username + ", userage=" + userage + ", usergender="
+ usergender + "]";
}
}
使用SpringMVC的框架所需要配置的配置文件：（放在资源文件夹下）
<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:p="http://www.springframework.org/schema/p"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:mvc="http://www.springframework.org/schema/mvc"
xsi:schemaLocation="http://www.springframework.org/schema/beans
http://www.springframework.org/schema/beans/spring-beans-4.0.xsd
http://www.springframework.org/schema/mvc
http://www.springframework.org/schema/mvc/spring-mvc-4.0.xsd
http://www.springframework.org/schema/context
http://www.springframework.org/schema/context/spring-context-4.0.xsd">
<!-- 包扫描：让com.oracle.controller和其子包中的所有被-->
<!-- @Controller、@Service、@Repository和@Component注解标注的类都被spring管理起来-->
<!-- 即我们只需要在类上做标记，而不需要为这些类再配置<bean>了-->
<context:component-scan base-package="com.oracle.controller" />
<context:component-scan base-package="com.oracle.service.impl" />
<context:component-scan base-package="com.oracle.dao.impl" />
<!-- 设置注解驱动 -->
<mvc:annotation-driven />
<!-- 视图解析器负责把handler方法返回值解析为实际的物理视图-->
<!-- 视图解析器使用SpringMVC框架默认的InternalResourceViewResolver-->
<!-- 这个视图解析器支持JSP视图解析 -->
<bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<!-- 配置 逻辑视图路径 的前缀和后缀，当然也可以不配置 -->
<!--<property name="prefix" value="/WEB-INF/jsp/" />-->
<!--<property name="suffix" value=".jsp" />-->
</bean>
</beans>
dao层代码如下：
package com.oracle.dao.impl;
import java.util.List;
import java.util.Map;
import org.springframework.stereotype.Repository;
import com.joe.jdbc.JDBC;
import com.joe.jdbc.JDBCFactory;
import com.oracle.dao.CRUDDao;
@Repository
public class CRUDDaoImpl implements CRUDDao {
private JDBC jdbc=JDBCFactory.getJDBC();//这个JDBC类是我自己封装的jar包中的
@Override
public List<Map<String, Object>> retrieveAllUser() {
String sql = "select user_id,username,userage,usergender "
+ "from t_user";
return jdbc.retrieveAll(sql);
}
@Override
public void createAllUser(String username, Integer userage, String usergender) {
String sql = "insert into t_user (username,userage,usergender) values (?,?,?)";
jdbc.doDML(sql,username,userage,usergender);
}
@Override
public void deleteUsers(String[] ids) {
String sql = "delete from t_user where user_id=?";
jdbc.doDelete(sql,ids);
}
@Override
public void updateUser(String username, Integer userage, String usergender,
Integer user_id) {
String sql ="update t_user set username=? , userage=?,usergender=? where user_id=?";
jdbc.doDML(sql, username,userage,usergender,user_id);
}
}
Service层代码如下：
package com.oracle.service.impl;
import java.util.List;
import java.util.Map;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import com.oracle.dao.CRUDDao;
import com.oracle.dao.impl.CRUDDaoImpl;
import com.oracle.pojo.UserPojo;
import com.oracle.service.CRUDService;
@Service
public class CRUDServiceImpl implements CRUDService {
@Autowired
private CRUDDao dao;//=new CRUDDaoImpl();
@Override
public List<Map<String, Object>> retrieveAllUser() {
return dao.retrieveAllUser();
}
@Override
public void createAllUser(UserPojo user) {
String username = user.getUsername();
String usergender = user.getUsergender();
Integer userage = user.getUserage();System.out.println("-------"+userage);
dao.createAllUser(username, userage, usergender);
}
@Override
public void deleteUsers(String[] ids) {
dao.deleteUsers(ids);
}
@Override
public void updateUser(UserPojo user) {
Integer user_id = user.getUser_id();
String username = user.getUsername();
Integer userage = user.getUserage();
String usergender = user.getUsergender();
dao.updateUser(username,userage,usergender,user_id);
}
}
控制层代码如下：（实际上也就是Servlet层。不过因为使用了SpringMVC框架，所以就叫控制层）
package com.oracle.controller;
import java.util.List;
import java.util.Map;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import com.oracle.pojo.FenyePojo;
import com.oracle.pojo.UserPojo;
import com.oracle.service.CRUDService;
@Controller
public class CRUDController {
@Autowired
private CRUDService cRUDService;
private FenyePojo fenye;
@ResponseBody
@RequestMapping(value="/retrieveAllUser")
public List<Map<String,Object>> retrieve(Integer [] q) {
if(fenye==null){
fenye=new FenyePojo();
}
List<Map<String,Object>> userList=cRUDService.retrieveAllUser();
return userList;
}
@RequestMapping(value="/createAllUser")
public String create(UserPojo user) {
cRUDService.createAllUser(user);
return "/html/Ajax.html";
}
@RequestMapping(value="/updateUser")
public String updateUser(UserPojo user) {
cRUDService.updateUser(user);
return "/html/Ajax.html";
}
@RequestMapping(value="/deleteUsers")
public String delete(String [] ids) {
cRUDService.deleteUsers(ids);
return "/html/Ajax.html";
}
}
到此为止，就只差一个我自己封装的JDBC的jar包了。但是这里不能够导进来，所以我就直接把该jar包中的四个类以及一个配置文件写在这里：
这是DataSource.java源程序文件：如下
package com.oracle.jdbc;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;
import java.util.ArrayList;
import java.util.List;
import java.util.PropertyResourceBundle;
import java.util.ResourceBundle;
//这个DataSource类只负责获取连接和关闭连接。
public class DataSource {
//连接池：在类加载的时候就提前创建好10个连接，如果需要就从池中拿一个，关闭的时候，再还回来。(相当于从来一个单进一次货 变为 进一堆货)
private static List<Connection > pool=new ArrayList<>();
private static String driver=null;
private static String url=null;
private static String username=null;
private static String password=null;
private static int size=0;
// 静态块：只执行一次: static{}：静态块中只能访问静态属性和静态方法
static{
// 需要在Java代码中绑定资源文件.properties文件。(注意：下面的括号里不需要加.properties文件后缀名，因为一旦调用这个绑定方法，就必定是.properties文件)
ResourceBundle bundle=PropertyResourceBundle.getBundle("DataSource"); //而且这个路径中也不需要写res这个路径.(因为res和src一样都是资源文件夹)
// 从资源文件中获取，取key
driver=bundle.getString("driver");
url=bundle.getString("url");
username=bundle.getString("username");
password=bundle.getString("password");
size=Integer.parseInt(bundle.getString("size"));
try{
Class.forName(driver);
for(int i=0;i<size;i++){
Connection con =DriverManager.getConnection(url,username,password);
pool.add(con);
}
}
catch(ClassNotFoundException e){ e.printStackTrace(); }
catch (SQLException e) {e.printStackTrace();}
}
public synchronized Connection getConnection(){
Connection con=null;
try{//从池中拿一个返回去
if(pool.isEmpty()){
con =DriverManager.getConnection(url,username,password);
}else{
//从池中移出一个，并返回给你
//get从池中拿出给你看一眼
con=pool.remove(0);
}
}
catch(SQLException e){e.printStackTrace(); }
return con;
}
public void closed(ResultSet resultset, Statement pstm,
Connection con) {
try{
if(resultset!=null) resultset.close();
}catch(SQLException e){
e.printStackTrace();
}finally{
try{
if(pstm!=null) pstm.close();
}catch(SQLException e){
e.printStackTrace();
}finally{
try{
if(con!=null){
if(pool.size()<size){ //判断池有没有满
pool.add(con);
}else{
con.close();
}
}
}catch(SQLException e){
e.printStackTrace();
}
}
}
}
public void closed(Statement stmt, Connection con) { //让用户体验更好
closed(null,stmt,con);
}
}
这是DataSourceFactory.java源程序文件：如下
package com.oracle.jdbc;
public class DataSourceFactory {
public static DataSource getDataSource(){
return new DataSource();
}
}
这是JDBC.java源程序文件：如下
package com.oracle.jdbc;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.ResultSetMetaData;
import java.sql.SQLException;
import java.sql.Statement;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
//ＪＤＢＣ这个类负责增删改查
public class JDBC {
/**全查询*/
public List<Map<String, Object>> retrieveAll(String sql, Object... params) {
//得到DataSource
//得到connection
//使用connection造船
//得到船Statement（PreparedStatement是其子接口）
//将sql与船绑定
//发船到数据库,船回来了 带了一个ResultSet回来
DataSource source=DataSourceFactory.getDataSource();
Connection con=source.getConnection();
List<Map<String,Object>> list=null;
PreparedStatement pstm=null;
ResultSet resultset=null;
try {
pstm=con.prepareStatement(sql);
for(int i=0;i<params.length;i++){
// setObject（p1,p2）;
// p1：往哪个位置上放(个数)
// p2：放的是什么
pstm.setObject(i+1, params[i]);
}
resultset=pstm.executeQuery();
// 一行一行的循环
// 元数据（列名，列数，约束.相当于标题）：从ResultSet中直接取不出来
// ResultSetMetaData 是结果集中的元数据
ResultSetMetaData metadata=resultset.getMetaData();
list=new ArrayList<Map<String,Object>>();
while(resultset.next()){
Map<String ,Object > map=new HashMap<>();
//遍历每一列
for(int i=1,j=metadata.getColumnCount();i<=j;i++){ //数据库中的都是从1开始的
String key=metadata.getColumnName(i);
String value=resultset.getString(i);
map.put(key,value);
}
list.add(map);
}
} catch (SQLException e) {
e.printStackTrace();
}finally{
//关闭资源
//后开的先关 resultSet --> statement --> connection
source.closed(resultset,pstm,con);
}
return list;
}
/**单查询*/
public Map<String,Object> retrieveOne(String sql,Object ...params){
List<Map<String,Object>> list=retrieveAll(sql,params);
Map<String,Object> map=null;
if(list.size()!=0){
map=list.get(0);
}
return map;
}
/**
* DQL 数据查询语言 select
* DML 数据操作语言 增删改 update set/ delete from/ insert into
* DCL 数据控制语言 grant revoke
* DDL 数据定义语言 alter
* */
public int doDML(String sql,Object... params){ //增删改
DataSource source=DataSourceFactory.getDataSource();
Connection con=source.getConnection();
List<Map<String,Object>> list=null;
PreparedStatement pstm=null;
int result=-1;
try {
pstm=con.prepareStatement(sql);
for(int i=0;i<params.length;i++){
pstm.setObject(i+1, params[i]);
}
result=pstm.executeUpdate(); //若操作成功，返回受影响行数
}catch(SQLException e){
e.printStackTrace();
}finally{
source.closed(pstm, con);
}
return result;
}
/**
* 事务保护
* 对于查询来说不需要保护，对于批量DML操作来说需要进行事物保护
* 要么都成功，要么都失败- 保证数据库操作的原子性
* 我们的操作是：暂时关闭它的自动提交功能。（如果是只有一条sql语句的话，一写完他就会自动提交的）
* update t_user userage = 0 where username = '谢大脚'
* update t_user userage = 18 where username = '赵四'
* commit();// 手动提交它
* 在catch中 rollback();// 手动回滚它
* finally中，把人家的自动提交功能再恢复
* 事物操作：提交、回滚
* */
/**
* 此方法用于不同类型的sql语句进行批量操作
* */
public int[] doBatch(List<String> sqls){
DataSource source=new DataSource();
Connection con=source.getConnection();
// PreparedStatement 处理问号的专用船
// Statement 不能处理问号
Statement stmt=null;
int [] result=null;
try {
con.setAutoCommit(false); //暂时先关闭自动提交功能
stmt = con.createStatement();
//将船与各条sql语句绑定
for(String sql: sqls){
stmt.addBatch(sql);
}
//发动船驶向数据库
result=stmt.executeBatch(); //因为有多条语句，所以每一条都有一个返回值。就构成数组
con.commit(); //手动提交
} catch (SQLException e) {
e.printStackTrace();
try {//如果出现异常可以进行回滚
con.rollback();
} catch (SQLException e1) {//回滚也可能出现异常，比如断电
e1.printStackTrace();
}
}finally{
//关闭资源
try {
con.setAutoCommit(true); //把人家的自动提交功能再恢复
} catch (SQLException e) {
e.printStackTrace();
}
source.closed(stmt, con);
}
return result;
}
/**
* 此方法用于相同类型的sql语句进行批量操作.(比如都是delete的sql语句)
* paramList:用来存所有的 参数。每条sql语句的要用到的参数都是分别用一个Object数组存储的。把每个数组都存在集合中
* */
public int[] doBatch(String sql,List<Object[]> paramList){
DataSource source=DataSourceFactory.getDataSource();
Connection con=source.getConnection();
int []result=null;
PreparedStatement pstm=null;
try {
con.setAutoCommit(false);
//造船
pstm=con.prepareStatement(sql);
//将船与各条sql语句绑定
for(Object[] params:paramList){
for(int i=0,j=params.length;i<j;i++){ //为每一条sql语句都配置上其应用的参数
pstm.setObject(i+1, params[i]);
}
pstm.addBatch(); //让船与每一条sql语句都绑定
}
result=pstm.executeBatch();
con.commit();
} catch (SQLException e) {
e.printStackTrace();
try {
con.rollback();
} catch (SQLException e1) { e1.printStackTrace(); }
} finally{
//关闭资源
source.closed(pstm, con);
try {
con.setAutoCommit(true); //把人家的自动提交功能再恢复
} catch (SQLException e) {
e.printStackTrace();
}
}
return result;
}
/**相同类型的sql语句 进行批量删除操作。并设置了事务保护*/
public int[] deleteBatch(String sql,String[] params){ //此方法只适用于一条sql语句中只有一个参数的操作
List<Object[]> list=new ArrayList<>();
for(String param:params){
Object [] object={param};
list.add(object);
}
return doBatch(sql,list);
}
}
这是JDBCFactory.java源程序文件：如下
package com.oracle.jdbc;
public class JDBCFactory {
public static JDBC getJDBC(){
return new JDBC();
}
}
这个jdbc的jar包中除了这四个类之外，还有一个DataSource.properties配置文件，用来配置四大参数：
driver=com.mysql.jdbc.Driver
url=jdbc:mysql://127.0.0.1:3306/你的数据库名称?characterEncoding=utf8
username=你的mysql登录账号
password=你的密码
size=10
有了这五样东西后，你可以将它们封装成jdbc的jar包，再将jar包导入上面的我写的那个使用了SpringMVC的项目中。注意：当你将它们封装成jar包后，那个DataSource.properties配置文件实际上就不能够使用了。因为每个封装成jar包的文件都变成了只读的。所以你需要在你导入这个jar包的项目中重新写一个一模一样的DataSource.properties配置文件。文件内容可到jar包中的DataSource.properties配置文件中复制出来。并将其中的数据库名称还有mysql登录的账号及密码改成你自己的。
因为我创建的是一个Maven项目。（创建该项目的好处在于，你想要什么jar包，不需要自己去下，只需在该项目的某个地方进行搜索就行。当然了，前提是你要配置好Maven的各种环境，比如说搭好本地仓库啊等等）。我导入的包有这些：
