2框架struts2个人高效秘籍：分页组合查询easyui实现模块管理，增删改查【诗书画唱】
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0">
<display-name>J190802</display-name>
<!-- struts2框架的配置 -->
<filter>
<filter-name>struts2</filter-name>
<filter-class>org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>struts2</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
<welcome-file-list>
<welcome-file>index.html</welcome-file>
<welcome-file>index.htm</welcome-file>
<welcome-file>index.jsp</welcome-file>
<welcome-file>default.html</welcome-file>
<welcome-file>default.htm</welcome-file>
<welcome-file>default.jsp</welcome-file>
</welcome-file-list>
</web-app>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
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 hreff="<%=basePath%>">
<title></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">
</head>
<body>
<h1 align="center">新增游戏</h1>
<form id="addFrm" action="" method="post">
<table align="center">
<tr>
<td>游戏名称：</td>
<td>
<input name="g.gname" class="easyui-validatebox"
data-options="required:true"
validType="length[6,30]"
invalidMessage="游戏名称的长度必须在6到30位之间"
style="width:180px;" />
</td>
</tr>
<tr>
<td>游戏类型：</td>
<td>
<input name="g.gtype" class="easyui-combobox"
style="width:180px;"
data-options="valueField:'id',textField:'gtype',
panelHeight:'auto',editable:false,url:'gm/loadTypeAc.action'" />
</td>
</tr>
<tr>
<td>游戏公司：</td>
<td>
<input name="g.gcomp" class="easyui-validatebox"
validType="length[4,30]"
invalidMessage="游戏公司的长度必须在4到30位之间"
style="width:180px;" />
</td>
</tr>
<tr>
<td>游戏年份：</td>
<td>
<input name="g.gyear" class="easyui-numberbox"
data-options="min:1000,max:9999"
style="width:180px;" />
</td>
</tr>
<tr>
<td colspan="2" align="center">
<a hreff="javascript:saveGame();" class="easyui-linkbutton"
data-options="iconCls:'icon-save'">保存</a>
<a hreff="javascript:clsWin();" class="easyui-linkbutton"
data-options="iconCls:'icon-cut'">取消</a>
</td>
</tr>
</table>
</form>
</body>
</html>
{"total":2,"rows":[{"id":1,"gname":"WANGZHERONGYI","gtype":"MOB","gcomp":"TENCENT","gyear":2010}]}
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
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 hreff="<%=basePath%>">
<title></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">
</head>
<body>
<h1 align="center">修改游戏</h1>
<form id="editFrm" action="" method="post">
<!-- 选中的游戏的id存放在隐藏表单域 -->
<input type="hidden" name="g.id" value="${g.id }"/>
<table align="center">
<tr>
<td>游戏名称：</td>
<td>
<input name="g.gname" class="easyui-validatebox"
data-options="required:true"
validType="length[2,30]" value="${g.gname }"
invalidMessage="游戏名称的长度必须在6到30位之间"
style="width:180px;" />
</td>
</tr>
<tr>
<td>游戏类型：</td>
<td>
<input name="g.gtype" class="easyui-combobox"
style="width:180px;" value="${g.gtype}"
data-options="valueField:'id',textField:'gtype',
panelHeight:'auto',editable:false,url:'gm/loadTypeAc.action'" />
</td>
</tr>
<tr>
<td>游戏公司：</td>
<td>
<input name="g.gcomp" class="easyui-validatebox"
validType="length[2,30]" value="${g.gcomp }"
invalidMessage="游戏公司的长度必须在4到30位之间"
style="width:180px;" />
</td>
</tr>
<tr>
<td>游戏年份：</td>
<td>
<input name="g.gyear" class="easyui-numberbox"
data-options="min:1000,max:9999" value="${g.gyear }"
style="width:180px;" />
</td>
</tr>
<tr>
<td colspan="2" align="center">
<a hreff="javascript:editGame();" class="easyui-linkbutton"
data-options="iconCls:'icon-save'">保存</a>
<a hreff="javascript:clsWin();" class="easyui-linkbutton"
data-options="iconCls:'icon-cut'">取消</a>
</td>
</tr>
</table>
</form>
</body>
</html>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
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 hreff="<%=basePath%>">
<title></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">
<link rel="stylesheet" type="text/css" hreff="css/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" hreff="css/themes/icon.css">
<script type="text/javascript" srcc="js/jquery.min.js"></script>
<script type="text/javascript" srcc="js/jquery.easyui.min.js"></script>
<!-- 语言汉化包 -->
<script type="text/javascript" srcc="js/locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript">
function toAdd(){
var url = 'add.jsp';
$('#win').window({
width : 700,//宽度
height : 550,//高度
title : '新增',
hreff : url
});
$('#win').window('open');//打开窗体
}
function toEdit(){
//获取选中的行
var row = $('#dg').datagrid('getSelected');
var id = row.id;
//判断是否选中
if(! row) {
$.messager.alert("提示", "请选要修改的数据", "info");
} else {
var url = 'gm/toEditAc.action?g.id=' + id;
$('#win').window({
width : 700,//宽度
height : 550,//高度
title : '修改',
hreff : url
});
$('#win').window('open');//打开窗体
}
}
function doDelete(){
//获取选中的行
var row = $('#dg').datagrid('getSelected');
var id = row.id;
//判断是否选中
if(! row) {
$.messager.alert("提示", "请选要删除的数据", "info");
} else {
//删除二次确认
$.messager.confirm("提示", "确定删除" + id + "的记录吗?",function(re) {
//re为true就表示点击了确定按钮
//re为false就表示点击了取消按钮
if(re) {
//提交ajax执行删除
$.ajax({
url: 'gm/deleteAc.action',
type: 'POST',
data: {
'g.id': id
},
success: function(data){
var o = JSON.parse(data);
if(o.ct > 0) {
$.messager.alert("提示", "删除成功！", "info");
//刷新datagrid
$('#dg').datagrid('reload');
} else {
$.messager.alert("提示", "删除失败！", "info");
}
}
});
}
});
}
}
function clsWin(){
$('#win').window('close');
}
//提交新增表单（在add.jsp页面调用这个方法）
//通过这种方式提交表单是没有页面跳转
function saveGame(){
//手动提交表单
$('#addFrm').form('submit',{
url: 'gm/addAc',
onSubmit: function(){//表单验证
//this就是指当前的表单
//调用表单验证的方法
var isValid = $(this).form('validate');
//if(!isValid) {
// alert('验证不通过')
//}
return isValid;
},
success: function(data){//表单提交成功以后执行的回调函数
var o = JSON.parse(data);
if(o.ct > 0) {
$.messager.alert("提示", "新增成功", "info");
//刷新datagrid
$('#dg').datagrid('reload');
//关闭窗体
$('#win').window('close');
} else {
$.messager.alert("提示", "新增失败", "info");
}
}
});
}
function editGame(){
$('#editFrm').form('submit',{
url: 'gm/editAc.action',
onSubmit: function(){
var isValid = $(this).form('validate');
return isValid;
},
success: function(data){
var o = JSON.parse(data);
if(o.ct > 0) {
$.messager.alert("提示", "修改成功", "info");
//刷新datagrid
$('#dg').datagrid('reload');
//关闭窗体
$('#win').window('close');
} else {
$.messager.alert("提示", "修改失败", "info");
}
}
});
}
function doQuery(){
//获取所有的搜索条件
var gname = $('#q_gname').val();
var gtype = $('#q_gtype').combobox('getValue');
var gcomp = $('#q_gcomp').val();
var starYear = $('#q_startYear').val();
var endYear = $('#q_endYear').val();
//执行查询
$('#dg').datagrid('reload',{
'g.gname': gname,
'g.gtype': gtype,
'g.gcomp': gcomp,
'g.startYear': starYear,
'g.endYear': endYear
});
}
</script>
</head>
<body>
<table id="dg" class="easyui-datagrid" title="游戏管理模块"
style="width:1000px;height:450px"
data-options="singleSelect:true,collapsible:true,
url:'gm/ldAllAc.action',method:'get',pagination:true,
pageList:[3,5,7,10,15],pageSize:5,toolbar:'#tb'">
<thead>
<tr>
<th data-options="field:'id',width:80">游戏ID</th>
<th data-options="field:'gname',width:100">游戏名称</th>
<th data-options="field:'gtype',width:80,align:'right'">游戏类型</th>
<th data-options="field:'gcomp',width:80,align:'right'">游戏公司</th>
<th data-options="field:'gyear',width:250">游戏年份</th>
</tr>
</thead>
</table>
<!-- 工具栏 -->
<div id="tb" style="padding:5px;height:auto">
<!-- 按钮工具栏 -->
<div style="margin-bottom:5px">
<a hreff="javascript:toAdd();" class="easyui-linkbutton"
iconCls="icon-add" plain="true" title="新增"></a>
<a hreff="javascript:toEdit();" class="easyui-linkbutton"
iconCls="icon-edit" plain="true" title="修改"></a>
<a hreff="javascript:doDelete();" class="easyui-linkbutton"
iconCls="icon-remove" plain="true" title="删除"></a>
</div>
<!-- 查询工具栏 -->
<div>
<p>
<input id="q_gname" placeholder="请输入游戏词条"
class="easyui-validatebox" style="width:140px;" />
<label>游戏类型：</label>
<input id="q_gtype" class="easyui-combobox"
style="width:180px;"
data-options="valueField:'id',textField:'gtype',
panelHeight:'auto',editable:false,url:'gm/loadTypeAc.action'" />
<input id="q_gcomp" placeholder="请输入公司词条"
class="easyui-validatebox" style="width:140px;" />
</p>
<p>
<label>游戏年份：</label>
<input id="q_startYear" class="easyui-numberbox"
style="width:120px;" data-options="min:1000,max:9999" />
<label>到</label>
<input id="q_endYear" class="easyui-numberbox"
style="width:120px;" data-options="min:1000,max:9999" />
<a hreff="javascript:doQuery();" class="easyui-linkbutton"
iconCls="icon-search"></a>
</p>
</div>
</div>
<!-- 弹出窗体 -->
<div id="win" class="easyui-window"
data-options="modal:true,closed:true,iconCls:'icon-save', top: 20,
minimizable: false,maximizable: false,collapsible: false,left: 100">
</div>
</body>
</html>
例子 END
例子运行效果 START
