11级_Java_曹建波 04.07 jQuery easyUI +struts2+hibernate+oracle 实现 admin用户的分页操作

jQuery easyUI +struts2+hibernate+oracle 

实现 admin用户的分页操作

 

核心代码

Init.js

$(document).ready(function() {

    //获取所有的a元素

    var $as = $("li>a");

    //获取id=tabs的元素

    var $tt = $("#tt");

    //注册点击事件

    $as.bind("click", function() {

        var text = $(this).text();

        var url = this.href;

        //获取添加的text 根据获取 id=tt面板中 是否包含含有 text标题的面板

        var curtab = $("#tt").tabs("getTab", text);

        alert(curtab);

        if (curtab) {

            //jQuery对象

            var iframe = $(curtab.panel('options').content);

            //根据属性名称获取 该属性值

            var src1 = 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');

                    }

                }]

            });

        }

        return false;

    });

});

//创建面板

function createFrame(url) {

    var src = '<iframe scrolling="auto" frameborder="0"  src="' + url + '" style="width:100%;height:100%;"></iframe>';

    return src;

}

Adminlist.js

$(document).ready(function() {

$('#adminlist').datagrid({

url : './csdn/AdminAction_query.action?time=' + new Date().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() {

var datas = $('#adminlist').datagrid('getSelections');

if (datas.length <= 0) {

showMsg("提示", "没有选中数据，不能执行删除!");

return;

}

$(datas).each(function(index) {

var rowIndex = $('#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("保存");

}

}]

});

var pagination = $('#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")) {

return false;

}

},

success : function(data) {

$("#adminlist").dialog("close");

$('#adminlist').datagrid("reload");

}

});

$('#adminlist').datagrid({

onDblClickRow : function(rowIndex, rowData) {

//alert(rowIndex+"------"+rowData.aname);

$('#adminlist').datagrid("beginEdit", rowIndex);

}

});

});

function showMsg(title, msg) {

$.messager.show({

title : title,

showType : "slide",

msg : msg,

timeout : 1000

});

}

Index.jsp

<%@ page language="java" import="java.util.*" 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 href="<%=basePath%>">

<title>My JSP 'index.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">

<!--

<link rel="stylesheet" type="text/css" href="styles.css">

-->

<link rel="stylesheet" type="text/css"

href="${pageContext.request.contextPath }/styles/easyui/themes/default/easyui.css">

<link rel="stylesheet" type="text/css"

href="${pageContext.request.contextPath }/styles/easyui/themes/icon.css">

<link rel="stylesheet" type="text/css"

href="${pageContext.request.contextPath }/styles/manager/init.css">

<script type="text/javascript"

src="${pageContext.request.contextPath }/scripts/jquery-1.8.0.min.js"></script>

<script type="text/javascript"

src="${pageContext.request.contextPath }/scripts/jquery.easyui.min.js"></script>

<script type="text/javascript"

src="${pageContext.request.contextPath }/scripts/manager/init.js"></script>

</head>

<body>

<div id="box" class="easyui-layout">

<!-- north开始 -->

<div data-options="region:'north',title:'North Title',split:true"

style="height:100px;"></div>

<!-- north结束 -->

<%--<div

data-options="region:'east',iconCls:'icon-reload',title:'East',split:true"

style="width:100px;"></div>

--%>

<!--west开始 -->

<div data-options="region:'west',title:'导航菜单',split:true"

style="width:200px;">

<div id="nav" class="easyui-accordion"

data-options="fit:true,border:false"

style="padding-right: 5px; padding-left: 5px;">

<div title="管理员管理" data-options="iconCls:'icon-save'">

<ul>

<li><a

href="${pageContext.request.contextPath }/backstage/admin/admin_list.jsp">管理员列表</a>

</li>

</ul>

</div>

<div title="会员管理">

<ul>

<li><a href="#">会员列表</a></li>

</ul>

</div>

<div title="商品类别管理" data-options="iconCls:'icon-reload'"

style="padding:10px;">

<ul>

<li><a href="${pageContext.request.contextPath }/backstage/goodstype_list.jsp">商品类别列表</a></li>

</ul>

</div>

<div title="商品管理" data-options="iconCls:'icon-reload'"

style="padding:10px;">

<ul>

<li><a href="#">商品列表</a></li>

</ul>

</div>

</div>

</div>

<!-- west结束 -->

<!-- center开始 -->

<div data-options="region:'center'" style="">

<div id="tt" class="easyui-tabs" data-options="fit:true">

<div title="后台操作的界面" style="padding:20px;">后台操作界面的说明</div>

</div>

</div>

<!-- center结束 -->

<!-- south开始 -->

<div data-options="region:'south',split:true"

style="height:25px; padding: 5px; background: #D2E0F2;">

<div align="center">版权归河北软件职业技术学院 @河软CSDN乐知学院所有2013-2020</div>

</div>

<!-- south结束 -->

</div>

</body>

</html>