jQueryeasyUI+struts2+hibernate+oracle
实现admin用户的分页操作
核心代码
Init.js
$(document).ready(function(){
//获取所有的a元素
var$as=$("li>a");
//获取id=tabs的元素
var$tt=$("#tt");
//注册点击事件
$as.bind("click",function(){
vartext=$(this).text();
varurl=this.href;
//获取添加的text根据获取id=tt面板中是否包含含有text标题的面板
varcurtab=$("#tt").tabs("getTab",text);
alert(curtab);
if(curtab){
//jQuery对象
variframe=$(curtab.panel('options').content);
//根据属性名称获取该属性值
varsrc1=iframe.attr("src");
$("#tt").tabs("update",{
tab:curtab,
options:{
content:createFrame(src1)
}
});
}else{
$("#tt").tabs('add',{
title:text,
closable:true,
content:createFrame(url),//创建面板内容
tools:[{
iconCls:'icon-mini-refresh',
handler:function(){
alert('refresh');
}
}]
});
}
returnfalse;
});
});
//创建面板
functioncreateFrame(url){
varsrc='<iframescrolling="auto"frameborder="0"src="'+url+'"style="width:100%;height:100%;"></iframe>';
returnsrc;
}
Adminlist.js
$(document).ready(function(){
$('#adminlist').datagrid({
url:'./csdn/AdminAction_query.action?time='+newDate().getTime(),
loadMsg:"数据正在加载……",
pageNumber:1,//初始化起始的页码
pageSize:10,//每页显示的数据量(测试改变不发生变化)
pageList:[10,15,20],//每页显示的数据量可选项
sortName:'aid',//定义排列的名称
sortOrder:'asc',//定义排列的方式asc
striped:true,//是否实现隔行变色
fitColumns:true,//是否自动设置列的宽度
singleSelect:false,
idField:'aid',//标识字段
frozenColumns:[[{
field:'ck',
checkbox:true
},{
title:'序号',
field:'aid',
width:50,
sortable:true
}]],
columns:[[{
field:'aname',
title:'用户名',
width:100
},{
field:'apass',
title:'密码',
width:100,
align:'left',
editor:{
type:'text'
}
}]],
pagination:true,
shownumbers:false,
toolbar:[{
iconCls:"icon-add",
text:"添加",
handler:function(){
$("#adminlist").dialog("open");
}
},{
iconCls:"icon-remove",
text:"删除",
handler:function(){
vardatas=$('#adminlist').datagrid('getSelections');
if(datas.length<=0){
showMsg("提示","没有选中数据,不能执行删除!");
return;
}
$(datas).each(function(index){
varrowIndex=$('#adminlist').datagrid('getRowIndex',this);
$('#adminlist').datagrid('deleteRow',rowIndex);
ids=this.aid;
});
$.post("./csdn/AdminAction_deleteById.action",{
id:ids
},function(){
showMsg("成功","删除成功!");
$('#adminlist').datagrid('reload');
});
}
},{
iconCls:"icon-edit",
text:"修改",
handler:function(){
alert("修改");
}
},{
iconCls:"icon-save",
text:"保存",
handler:function(){
alert("保存");
}
}]
});
varpagination=$('#adminlist').datagrid('getPager');
//设置分页属性
pagination.pagination({
beforePageText:"第",
afterPageText:"页共{pages}页",
displayMsg:"从第{from}条到第{to}条共{total}条"
});
$("#adminlist").dialog({
title:"添加管理员",
modal:true,
width:300,
height:350,
closed:true,
onBeforeOpen:function(){
$("#parentType").combotree("reload");
$("#add").form("clear");
}
});
$("#add").form({
url:'../../csdn/addGoodsType.action',
onSubmit:function(){
if(!$("#aname").validatebox("isValid")||!$("#apass").validatebox("isValid")){
returnfalse;
}
},
success:function(data){
$("#adminlist").dialog("close");
$('#adminlist').datagrid("reload");
}
});
$('#adminlist').datagrid({
onDblClickRow:function(rowIndex,rowData){
//alert(rowIndex+"------"+rowData.aname);
$('#adminlist').datagrid("beginEdit",rowIndex);
}
});
});
functionshowMsg(title,msg){
$.messager.show({
title:title,
showType:"slide",
msg:msg,
timeout:1000
});
}
Index.jsp
<%@pagelanguage="java"import="java.util.*"pageEncoding="UTF-8"%>
<%
Stringpath=request.getContextPath();
StringbasePath=request.getScheme()+"://"
+request.getServerName()+":"+request.getServerPort()
+path+"/";
%>
<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN">
<html>
<head>
<basehref="<%=basePath%>">
<title>MyJSP'index.jsp'startingpage</title>
<metahttp-equiv="pragma"content="no-cache">
<metahttp-equiv="cache-control"content="no-cache">
<metahttp-equiv="expires"content="0">
<metahttp-equiv="keywords"content="keyword1,keyword2,keyword3">
<metahttp-equiv="description"content="Thisismypage">
<!--
<linkrel="stylesheet"type="text/css"href="styles.css">
-->
<linkrel="stylesheet"type="text/css"
href="${pageContext.request.contextPath}/styles/easyui/themes/default/easyui.css">
<linkrel="stylesheet"type="text/css"
href="${pageContext.request.contextPath}/styles/easyui/themes/icon.css">
<linkrel="stylesheet"type="text/css"
href="${pageContext.request.contextPath}/styles/manager/init.css">
<scripttype="text/javascript"
src="${pageContext.request.contextPath}/scripts/jquery-1.8.0.min.js"></script>
<scripttype="text/javascript"
src="${pageContext.request.contextPath}/scripts/jquery.easyui.min.js"></script>
<scripttype="text/javascript"
src="${pageContext.request.contextPath}/scripts/manager/init.js"></script>
</head>
<body>
<divid="box"class="easyui-layout">
<!--north开始-->
<divdata-options="region:'north',title:'NorthTitle',split:true"
style="height:100px;"></div>
<!--north结束-->
<%--<div
data-options="region:'east',iconCls:'icon-reload',title:'East',split:true"
style="width:100px;"></div>
--%>
<!--west开始-->
<divdata-options="region:'west',title:'导航菜单',split:true"
style="width:200px;">
<divid="nav"class="easyui-accordion"
data-options="fit:true,border:false"
style="padding-right:5px;padding-left:5px;">
<divtitle="管理员管理"data-options="iconCls:'icon-save'">
<ul>
<li><a
href="${pageContext.request.contextPath}/backstage/admin/admin_list.jsp">管理员列表</a>
</li>
</ul>
</div>
<divtitle="会员管理">
<ul>
<li><ahref="#">会员列表</a></li>
</ul>
</div>
<divtitle="商品类别管理"data-options="iconCls:'icon-reload'"
style="padding:10px;">
<ul>
<li><ahref="${pageContext.request.contextPath}/backstage/goodstype_list.jsp">商品类别列表</a></li>
</ul>
</div>
<divtitle="商品管理"data-options="iconCls:'icon-reload'"
style="padding:10px;">
<ul>
<li><ahref="#">商品列表</a></li>
</ul>
</div>
</div>
</div>
<!--west结束-->
<!--center开始-->
<divdata-options="region:'center'"style="">
<divid="tt"class="easyui-tabs"data-options="fit:true">
<divtitle="后台操作的界面"style="padding:20px;">后台操作界面的说明</div>
</div>
</div>
<!--center结束-->
<!--south开始-->
<divdata-options="region:'south',split:true"
style="height:25px;padding:5px;background:#D2E0F2;">
<divalign="center">版权归河北软件职业技术学院@河软CSDN乐知学院所有2013-2020</div>
</div>
<!--south结束-->
</div>
</body>
</html>