EasyUI 高级控件 之 增删查改

EasyUI 高级控件

前言：

现如今，大部分的项目都是采用了前后端分离的方法，那么，为什么要采用前后端分离呢？这样做有什么优势呢？

让我们来对比分析一下之前的开发模式与前后端分离模式的区别 。

陈旧的开发模式：

美工（ui工程师：编写项目模型）

java工程师：将原有的html转成jsp，动态展示数据

缺点：
	客户需要调节前端的展示效果 （样式美化）
	
	解决：由美工去重新排版，重新选色。

前后端分离：

美工、java工程师都是独立工作的，彼此之间在开发过程中没有任何交际 。
但是，要在开发前约定数据交互的格式。

美工：只管展示 tree_data1.json

java工程师的工作：写方法返回数据，如：tree_data1.json

---

EasyUI的crud

增、删、改思路分析

具体思路：

增加、删除、修改 我都是用的form表单传值，在jsp界面，定义一个隐藏传值①，在具体调用哪个方法的时候，给这个①设置值（add、del、edit）；

删除和修改，需要选中某一行，从而对该行的数据进行操作，所以，可以先判断是否有某一行被选中，如果没有，就弹个提示框提示一下，有的话就进行操作；

增加的时候，因为都是用一个弹出对话框，所以，调用该的时候，首先要先清除弹出对话框form表单里面的内容；

删除的时候，因为只需要传一个参数ID,所以弹出框可以不必要展示出来 ；

form表单提交后，就可以关闭弹出框、并刷新表单数据、清空弹出框的信息即可 。

注意：

• 为避免出现不必要的路径错误，建议大家用绝对路径，先在jsp界面定义隐藏域传值（ < input type=“hidden” id=“mypath” value="${pageContext.request.contextPath }"> ），然后，在自定义js界面拼接即可 （ $("#mypath").val() ）。

• 数据库中的主键最好用int类型，并设置自动增加 。

---

DataGrid、dialog、form讲解

DataGrid 布局

可使用Javascript去创建DataGrid控件（除此之外，还有另外的方法，） 。

userManage.jsp

userManage.js

效果展示：

---

Dialog 布局

Form 布局

---

通用操作方法

JsonBaseDao

package com.dj.util;

import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.ResultSetMetaData;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

public class JsonBaseDao extends BaseDao<Map<String,Object>> {
   
	/**
	 * 通用分页查询方法
	 * 
	 * @param sql
	 * @param pageBean
	 * @return
	 * @throws SQLException
	 * @throws InstantiationException
	 * @throws IllegalAccessException
	 */
	public List<Map<String,Object>> executeQuery(String sql, PageBean pageBean) throws SQLException, InstantiationException, IllegalAccessException{
   
		return super.executeQuery(sql, pageBean, new Callback<Map<String,Object>>() {
   
			@Override
			public List<Map<String,Object>> foreach(ResultSet rs) throws SQLException, InstantiationException, IllegalAccessException {
   
				/*
				 * 1、创建一个实体类的实例
				 * 2、给创建的实例属性赋值
				 * 3、将添加完类容的实体类添加到list集合中
				 */
//				list.add(new Book(rs.getInt("bid"), rs.getString("bname"), rs.getFloat("price")));
				List<Map<String,Object>> list = new ArrayList<>();
//				获取源数据
				ResultSetMetaData md = rs.getMetaData();
				int count = md.getColumnCount();
				Map<String,Object> map = null;
				while(rs.next()) {
   
					map = new HashMap<>();
					for (int i = 1; i <= count; i++) {
   
						map.put(md.getColumnName(i), rs.getObject(i));
					}
					list.add(map);
				}
				return list;
			}
		});
	}
	
	/**
	 * 通用增删改方法
	 * 
	 * @param sql
	 * @param attrs	map中的key
	 * @param paMap	jsp向后台传递的参数集合
	 * @return
	 * @throws SQLException
	 * @throws NoSuchFieldException
	 * @throws SecurityException
	 * @throws IllegalArgumentException
	 * @throws IllegalAccessException
	 */
	public int executeUpdate(String sql, String[] attrs, Map<String,String[]> paMap) throws SQLException, NoSuchFieldException, SecurityException, IllegalArgumentException, IllegalAccessException {
   
		Connection con = DBAccess.getConnection();
		PreparedStatement pst = con.prepareStatement(sql);
		for (int i = 0; i < attrs.length; i++) {
   
			pst.setObject(i+1, JsonUtils.getParamVal(paMap, attrs[i]));
		}
		return pst.executeUpdate();
	}
}

---

dao 层

UserDao

package com.dj.dao;

import java.sql.SQLException;
import java.util.List;
import java.util.Map;

import com.dj.util.JsonBaseDao;
import com.dj.util.JsonUtils;
import com.dj.util.PageBean;
import com.dj.util.StringUtils;

public class UserDao extends JsonBaseDao {
   
	
	/**
	 * 登录
	 * 
	 * 登录查询用户表 t_easyui_user_version2
	 * @param paMap 传值
	 * @param pageBean 是否分页
	 * @return
	 * @throws SQLException 
	 * @throws IllegalAccessException 
	 * @throws InstantiationException 
	 */
	public List<Map<String, Object