Easy UI + Servlet + MySQL 显示数据库里面的记录

来源：互联网发布：金川公司网络学校编辑：程序博客网时间：2024/05/29 12:28

查阅了网上很多资料，终于把数据库里面的数据显示到easyUI界面了，记录一下，以后忘了可以再回来看看。

其中需要注意的是：

1.EsayUI需要的datagrid是json格式的，所以取出结果数据后需要转换一下。

2.datagrid里面格式为{"total":2，"rows":[{"adminID":2,"adminName":"admin","adminPassword":"admin"},......]}

页面嵌入内容为EasyUI网上的 EasyUI 创建 CRUD 应用，

一、这里需要引入的easyUI的css、js分别为.../themes/default/easyui.css、.../themes/icon.css、jQuery、.../jquery.easyui.min.js、easyui-lang-zh_CN.js 还有相关的themes，plugins文件等

需要修改的地方有两个：

1、<table url="....."> url 为自己写的servlet请求,这里是获取数据,例如:我这里是getAdmin

2、<th field="...."> 标题栏的field为对应数据库里面的字段名,例如:adminId...

二、创建后台jdbc连接

public class JDBC{

//省略，静态方法getConnection返回一个Connection对象

}

三、创建Servlet

继承HttpServlet并重写doGet()/doPost(); 同时在web.xml中注册这个servlet，或者直接在类前面加@WebServlet("/getAdmin") 注：加了注解再配置xml或报错。二者选其一

四、导jar包

需要json和connector的包：

commons-beanutils-1.8.0.jar

commons-collections-3.1.jar
commons-lang-2.4.jar
commons-logging-1.0.4.jar
ezmorph-1.0.6.jar
json-lib-2.3-jdk15.jar
mysql-connector-java-5.1.3-rc-bin.jar

五、获取数据库中的结果集,并调用第六步中的转换方法

private String getAdmins(){Connection conn = null;Statement st = null;ResultSet rs = null;String result = "";  //返回结果try {conn = JDBC.getConnection();st = conn.createStatement();rs = st.executeQuery("select * from admin");//将结果转换成jsonresult = resultSetToJson(rs);} catch (SQLException e) {e.printStackTrace();} finally {//关闭资源rs.st.conn}return result;}

六、将结果集转换成json格式

private String resultSetToJson(ResultSet rs) throws SQLException{//保存结果JSONObject result = new JSONObject();//以数组的形式保存数据库结果集JSONArray jsonArr= new JSONArray();//获取列数ResultSetMetaData meta = rs.getMetaData();int colmun = meta.getColumnCount();/*result.put("total", colmun);   //添加行数    :之前犯的错误*///保存列数int rows = 0;//遍历结果集while(rs.next()){//将每行当做一个对象保存JSONObject obj = new JSONObject();for (int i = 1; i <= colmun; i++) {String colName = meta.getColumnLabel(i);    //获取列名String value = rs.getString(colName);    //获取列名对应的值obj.put(colName, value);    //将列名-值键值对写入JSONObject}jsonArr.add(obj);    //添加到数组中rows ++;}result.put("total", rows);   //添加行数result.put("rows", jsonArr);return result.toString();}

七、将第五步得到字符串输出给页面（在doPost()/doGet方法中）

resp.setCharacterEncoding("UTF-8");resp.setContentType("application/json;charset=utf-8");String str = getAdmins();PrintWriter out = null;//获取response的输出流out = resp.getWriter();if(out != null){out.write(str);out.close();}

八、测试
main方法测试getAdmins()方法的输出：

{"total":3,"rows":[{"adminID":"2","adminName":"admin","adminPassword":"admin"},{"adminID":"4","adminName":"admin2","adminPassword":"admin2"}]}

页面上的输出，表格列对应表字段的数据

九、总结

过程：

1、从数据库中查询到的数据在ResultSet中，将ResultSet中的数据每行转换成一个JSONObject，添加到JSONArray中

2、返回数据格式为{"total":总行数, "rows":JSONArray} 返回总行数和得到的数组数据

3、当请求Servlet的时候、用response对象将获取的数据输出到页面

4、datagrid请求url为Servlet的名字，th的field属性与数据库表字段名对应

5、显示页面

******************************************

后记：

贴出的代码中有一处错误，感谢答主的指教：total存储的是行数，而我保存进去的确实列数，已改正，

0 0