实习日记（4-17）搭建SSH+EasyUI的小Demo

小记

昨天搞了我很久的一个小bug被我解决了

bug描述：
昨天搭建SSH框架，连接了远程的DB2数据库
但是调试的时候报 500 的错误
这里有一篇整理的 HTTP 状态解析的博客：
https://blog.youkuaiyun.com/angelo_gs/article/details/88943169
500 – 内部服务器错误
我就将sql代码打印到控制台，复制到datastudio中完美执行，最终发现是db2数据库连接的用户名写错了，但是测试连接的时候没有报错，我在datastudio中用错的用户名登录发现也登录上了，只是里面没有数据，修改用户名，跑起来了
报错信息：

HTTP Status 500 -

type Exception report

message

description The server encountered an internal error that prevented it from fulfilling this request.

exception

java.lang.NullPointerException
	dao.ClassDaoImpl.findAll(ClassDaoImpl.java:13)
	action.ClassAction.findall(ClassAction.java:19)
	sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
	sun.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:57)
	sun.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
	java.lang.reflect.Method.invoke(Method.java:606)
	com.opensymphony.xwork2.DefaultActionInvocation.invokeAction(DefaultActionInvocation.java:452)
	com.opensymphony.xwork2.DefaultActionInvocation.invokeActionOnly(DefaultActionInvocation.java:291)
	com.opensymphony.xwork2.DefaultActionInvocation.invoke(DefaultActionInvocation.java:254)
	com.opensymphony.xwork2.interceptor.DefaultWorkflowInterceptor.doIntercept(DefaultWorkflowInterceptor.java:176)
	com.opensymphony.xwork2.interceptor.MethodFilterInterceptor.intercept(MethodFilterInterceptor.java:98)
	com.opensymphony.xwork2.DefaultActionInvocation.invoke(DefaultActionInvocation.java:248)
	com.opensymphony.xwork2.validator.ValidationInterceptor.doIntercept(ValidationInterceptor.java:263)
	org.apache.struts2.interceptor.validation.AnnotationValidationInterceptor.doIntercept(AnnotationValidationInterceptor.java:68)
	com.opensymphony.xwork2.interceptor.MethodFilterInterceptor.intercept(MethodFilterInterceptor.java:98)
	com.opensymphony.xwork2.DefaultActionInvocation.invoke(DefaultActionInvocation.java:248)
	com.opensymphony.xwork2.interceptor.ConversionErrorInterceptor.intercept(ConversionErrorInterceptor.java:133)
	com.opensymphony.xwork2.DefaultActionInvocation.invoke(DefaultActionInvocation.java:248)
	com.opensymphony.xwork2.interceptor.ParametersInterceptor.doIntercept(ParametersInterceptor.java:207)
	com.opensymphony.xwork2.interceptor.MethodFilterInterceptor.intercept(MethodFilterInterceptor.java:98)
	com.opensymphony.xwork2.DefaultActionInvocation.invoke(DefaultActionInvocation.java:248)
	com.opensymphony.xwork2.interceptor.ParametersInterceptor.doIntercept(ParametersInterceptor.java:207)
	com.opensymphony.xwork2.interceptor.MethodFilterInterceptor.intercept(MethodFilterInterceptor.java:98)
	com.opensymphony.xwork2.DefaultActionInvocation.invoke(DefaultActionInvocation.java:248)
	com.opensymphony.xwork2.interceptor.StaticParametersInterceptor.intercept(StaticParametersInterceptor.java:190)
	com.opensymphony.xwork2.DefaultActionInvocation.invoke(DefaultActionInvocation.java:248)
	org.apache.struts2.interceptor.MultiselectInterceptor.intercept(MultiselectInterceptor.java:75)
	com.opensymphony.xwork2.DefaultActionInvocation.invoke(DefaultActionInvocation.java:248)
	org.apache.struts2.interceptor.CheckboxInterceptor.intercept(CheckboxInterceptor.java:94)
	com.opensymphony.xwork2.DefaultActionInvocation.invoke(DefaultActionInvocation.java:248)
	org.apache.struts2.interceptor.FileUploadInterceptor.intercept(FileUploadInterceptor.java:243)
	com.opensymphony.xwork2.DefaultActionInvocation.invoke(DefaultActionInvocation.java:248)
	com.opensymphony.xwork2.interceptor.ModelDrivenInterceptor.intercept(ModelDrivenInterceptor.java:100)
	com.opensymphony.xwork2.DefaultActionInvocation.invoke(DefaultActionInvocation.java:248)
	com.opensymphony.xwork2.interceptor.ScopedModelDrivenInterceptor.intercept(ScopedModelDrivenInterceptor.java:141)
	com.opensymphony.xwork2.DefaultActionInvocation.invoke(DefaultActionInvocation.java:248)
	org.apache.struts2.interceptor.debugging.DebuggingInterceptor.intercept(DebuggingInterceptor.java:267)
	com.opensymphony.xwork2.DefaultActionInvocation.invoke(DefaultActionInvocation.java:248)
	com.opensymphony.xwork2.interceptor.ChainingInterceptor.intercept(ChainingInterceptor.java:142)
	com.opensymphony.xwork2.DefaultActionInvocation.invoke(DefaultActionInvocation.java:248)
	com.opensymphony.xwork2.interceptor.PrepareInterceptor.doIntercept(PrepareInterceptor.java:166)
	com.opensymphony.xwork2.interceptor.MethodFilterInterceptor.intercept(MethodFilterInterceptor.java:98)
	com.opensymphony.xwork2.DefaultActionInvocation.invoke(DefaultActionInvocation.java:248)
	com.opensymphony.xwork2.interceptor.I18nInterceptor.intercept(I18nInterceptor.java:176)
	com.opensymphony.xwork2.DefaultActionInvocation.invoke(DefaultActionInvocation.java:248)
	org.apache.struts2.interceptor.ServletConfigInterceptor.intercept(ServletConfigInterceptor.java:164)
	com.opensymphony.xwork2.DefaultActionInvocation.invoke(DefaultActionInvocation.java:248)
	com.opensymphony.xwork2.interceptor.AliasInterceptor.intercept(AliasInterceptor.java:190)
	com.opensymphony.xwork2.DefaultActionInvocation.invoke(DefaultActionInvocation.java:248)
	com.opensymphony.xwork2.interceptor.ExceptionMappingInterceptor.intercept(ExceptionMappingInterceptor.java:187)
	com.opensymphony.xwork2.DefaultActionInvocation.invoke(DefaultActionInvocation.java:248)
	org.apache.struts2.impl.StrutsActionProxy.execute(StrutsActionProxy.java:52)
	org.apache.struts2.dispatcher.Dispatcher.serviceAction(Dispatcher.java:485)
	org.apache.struts2.dispatcher.ng.ExecuteOperations.executeAction(ExecuteOperations.java:77)
	org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter.doFilter(StrutsPrepareAndExecuteFilter.java:91)

note The full stack trace of the root cause is available in the Apache Tomcat/7.0.82 logs.
Apache Tomcat/7.0.82

• 淘到一篇讲
  在Struts2中使用ValueStack、ActionContext、ServletContext、request、session等
  的博客：
  https://blog.youkuaiyun.com/ambow_cq/article/details/7458810#t17
  我在使用EasyUI，看到

<table class="easyui-propertygrid" data-options="">  

<table id="pg" class="easyui-propertygrid" style="width:300px" data-options="
				url:'propertygrid_data1.json',
				method:'get',
				showGroup:true,
				scrollbarSize:0
			">
</table>

在propertygrid的小Demo中data-options属性，请求了一个url，应该是跟数据源相关的，请求的是一个json，是后台传过来了一个json数据？

翻看别人的源码是学习新东西比较快的方法：
SSH+EasyUI做的系统

• 淘到一篇讲 Struts、Ajax、Json的博客：
  https://blog.youkuaiyun.com/u010900754/article/details/50527630
• Struts2

 * Struts执行流程：先创建Action，再调用拦截器，拦截器访问成功再调用Action的方法
 * 在项目启动的时候Struts的过滤器，已经把相应的内置对象，和内置对象对应的Map存储到了ActionContext和值栈中
 * 如果实现了相应的xxxAware接口，就会从ActionContext中获取相应的Map进行传入。实现这个的拦截器为：servletConfig
 * servletConfig：有如下代码：判断当前实现什么接口，则会注入相应的对象

有关Struts2输出向前台json的实例（已完成）：

Action:
其中Classgrade是实例

	public String query(){
		classgradeMap= new HashMap<String , Object>();
		List<Classgrade> ClassgradeList= classgradeService.findALL();
		classgradeMap.put("rows", ClassgradeList);
		return "jsonList";
	}

struts.xml:

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.1//EN" "http://struts.apache.org/dtds/struts-2.1.dtd">
<struts>
	<package name="any" extends="json-default">
		<action name="*Classgrade" method="{1}" class="com.rw.lianxi.Action.ClassgradeAction">
			<result name="ClassGradeList" >ClassGradeList.jsp</result>
			<result name="jsonList" type="json">
				<param name="root">classgradeMap</param>此处的classgradeMap对应着Action中的classgradeMap，root是固定的写法
			</result>
		</action>
	</package>
</struts>    

在strut2.xml文件中
json-default继承了struts-default
跑一下：

前台的action请求获取到了

接下来就是用EsayUI使用获取到的Json了：

• 使用EasyUI的datagrid使用Json：
  这里给我绕了一个弯儿，有关EasyUI的引入：
  引入EasyUI的js、css文件时，
  EasyUI/src/jquery.min.js 要在 EasyUI/src/jquery.easyui.min.js前面，js要在css前面，否则引用失败

写博客用红色字的方法：使用html标签

<font color=red>EasyUI/src/jquery.min.js 要在 EasyUI/src/jquery.easyui.min.js前面，js要在css前面，否则引用失败</font>

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="/struts-tags" prefix="s"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>My JSP 'ClassGradeList.jsp' starting page</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">

<script type="text/javascript" src="EasyUI/src/jquery.min.js"></script>
<script type="text/javascript" src="EasyUI/src/jquery.easyui.min.js"></script>
<link rel="stylesheet" type="text/css" href="EasyUI/themes/black/easyui.css">
<link rel="stylesheet" type="text/css" href="EasyUI/themes/icon.css">
<style type="text/css">
# main{
	margin:20px auto;
}
</style>
</head>
<script type="text/javascript" >
	$(function() {
		$('#dg').datagrid({
			url : 'queryClassgrade.action',
			fitColumns:true,
			striped:true,//隔行变浅色
			nowrap:true,
			singleSelect:true,//单选
			pagination:true,//分页
			columns : [ [ 
			{
				field : 'code',
				title : '数量',
				width : 100
			}, 
			{
				field : 'name',
				title : '班级名称',
				width : 100
			}, 
			{
				field : 'address',
				title : '地址',
				width : 100,
				align : 'right'
			}, 
			{
				field : 'note',
				title : '备注',
				width : 100,
				align : 'right'
			}, 
			{
				field : 'id',
				title : 'ID',
				width : 100,
				align : 'right'
			}
			 ] ],
			
		});
	});
</script>

<body>
<div id="main">
	<table id="dg"></table>
	</div>
</body>
</html>

BINGGO!

到此SSH框架搭建好了，前端EasyUI小用了一下
下一步实现前端页面的增删改查

前端页面的增删改查

淘到一篇EasyUI实现CRUD的实例博客：
https://www.cnblogs.com/liuwenwu9527/p/11023890.html

datagrid的相关属性：
http://www.jeasyui.net/plugins/183.html
通过toolbar属性添加增删改查的按钮：

	toolbar: [{
		iconCls: 'icon-edit',
		handler: function(){alert('编辑按钮')}
	},'-',{
		iconCls: 'icon-help',
		handler: function(){alert('帮助按钮')}
	}]

接下来实现按钮功能