<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>账户管理</title>
<meta name="keywords" content="电子商务 账户管理">
<meta name="description" content="账户管理">
<link type="text/css" rel="stylesheet"
href="<%=request.getContextPath()%>/ext/resources/css/ext-all.css">
</head>
<body>
<div id="formdiv"></div>
<div id="griddiv"></div>
<script src="<%=request.getContextPath()%>/ext/js/ext-base.js"
type="text/javascript"></script>
<script src="<%=request.getContextPath()%>/ext/js/ext-all-debug.js"
type="text/javascript"></script>
<script language="javascript">
Ext.onReady(function(){
//动态返回所属部门Json下拉框数据
var dataforsex=new Ext.data.JsonStore({
//autoLoad : true,
url:'../accountinfo/getdep',//请求获取部门信息
fields:["id","val"]
});
var formdiv=new Ext.form.FormPanel({
id:'query',
name:'query',
renderTo:"formdiv",
items:[{
xtype:"fieldset",
title:"帐号查询",
layout: 'column',
collapsible:true,
autoHeight:true,
labelAlign:"right",
buttonAlign:"center",
items:[{
layout : 'form',
border : false,
items : [{
xtype:"textfield",
id:"accountinfoname",
columnWidth : .3,
layout:"form",
fieldLabel:"账号"
}]},{
layout : 'form',
border : false,
items : [{
xtype:"textfield",
id:"role",
columnWidth : .3,
layout:"form",
fieldLabel:"角色"
}]
},{
layout : 'form',
border : false,
items : [{
xtype:"combo",
id: "department",
store: dataforsex,
hiddenName: "id", //隐式值,form获取该组件时使用此值,
displayField: "val", //显示值,用于在页面表示的值
mode: 'remote', //数据获取来源方式,这里表示远程下载
forceSelection: true,
blankText: '', //设置空白默认值
emptyText: '请选择类型', //设置默认值
editable: false,
triggerAction: 'all',
allowBlank: true,
fieldLabel: '所属部门'
}]
}],
buttons:[{
xtype:"button",
//点击事件处理
handler: send,
text:"查询"
},
{xtype:"button",
handler:reset,//点击事件处理
text:"重置"
}]
}]
});
//重置事件处理
function reset(){
formdiv.getForm().reset();
}
//网格数据grid
//网格数据缓存
var dataforgrid=new Ext.data.JsonStore({
//autoLoad :true,
root:"data",
totalProperty:"all",
fields:["id","accountinfoname","password","role","department_"],//数据格式,对映grid中dataindex的值
url:"../accountinfo/accountlist_0" //向服务器请求数据
});
var cm=new Ext.grid.CheckboxSelectionModel({
singleSelect:true//grid数据行的单多选属性
});
//查询事件处理
function send(){
Ext.Msg.alert("title",Ext.getDom("department").hiddenValue
);
dataforgrid.load({params:{
start:0,
limit:5,
accountinfoname:Ext.getDom("accountinfoname").value,
role:Ext.getDom("role").value,
department_:Ext.getDom("department").value
}});
}
var grid = new Ext.grid.GridPanel({
//grid面板前端工具条
tbar:new Ext.PagingToolbar({
pageSize:5,
displayInfo : true,
displayMsg : '显示第 {0} 条到 {1} 条记录,一共 {2} 条记录',
emptyMsg : '没有记录',
store:dataforgrid,
items:[{
xtype:"button",
width:"50",
//点击事件处理
handler: function add(){
window.location.href ='../accountinfo/add';
},
text:"新增"
},{
xtype:"button",
width:"50",
//点击事件处理
handler: function edit(){
if(grid.getSelectionModel().getCount()==0){
Ext.Msg.alert("提示","请选择一项修改");
}
else{
window.location.href ='../accountinfo/edit_'+grid.getSelectionModel().getSelected().id;
//请求服务器处理edit事件
}
},
text:"修改"
},{xtype: 'tbseparator'},
{xtype:"button",
width:"50",
handler:function dele(){
if(grid.getSelectionModel().getCount()==0){
Ext.Msg.alert("提示","请选择一项修改");
}
else{
var url='../accountinfo/delete_'+grid.getSelectionModel().getSelected().id;
Ext.Ajax.request({
url: url,
success: function(response){
dataforgrid.remove(grid.getSelectionModel().getSelected());
},
failure: function(){
Ext.Msg.alert("错误","删除出错,请重试。");
}
});
//请求服务器处理edit事件
}
},//点击事件处理
text:"删除"
}]
}),
renderTo:"griddiv",//渲染到页面div标签id="griddiv"的地方
store: dataforgrid, //加载数据
columns: [
new Ext.grid.RowNumberer(),
cm,
//注意dataindex 对载入的store数据字段名。
{id:"id", width: 200, hidden :true, dataIndex: 'id'},
{ header: "账号", width: 200, sortable: true, dataIndex: 'accountinfoname'},
{ header: "密码", width: 200, sortable: true, dataIndex: 'password'},
{ header: "角色", width: 200, sortable: true, dataIndex: 'role'},
{ header: "所属部门", width: 200, sortable: true, dataIndex: 'department_'}
],
sm: cm,
height:300
});
dataforgrid.load({params : {start:0,limit:5}});
});
</script>
</body>
</html>
pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>账户管理</title>
<meta name="keywords" content="电子商务 账户管理">
<meta name="description" content="账户管理">
<link type="text/css" rel="stylesheet"
href="<%=request.getContextPath()%>/ext/resources/css/ext-all.css">
</head>
<body>
<div id="formdiv"></div>
<div id="griddiv"></div>
<script src="<%=request.getContextPath()%>/ext/js/ext-base.js"
type="text/javascript"></script>
<script src="<%=request.getContextPath()%>/ext/js/ext-all-debug.js"
type="text/javascript"></script>
<script language="javascript">
Ext.onReady(function(){
//动态返回所属部门Json下拉框数据
var dataforsex=new Ext.data.JsonStore({
//autoLoad : true,
url:'../accountinfo/getdep',//请求获取部门信息
fields:["id","val"]
});
var formdiv=new Ext.form.FormPanel({
id:'query',
name:'query',
renderTo:"formdiv",
items:[{
xtype:"fieldset",
title:"帐号查询",
layout: 'column',
collapsible:true,
autoHeight:true,
labelAlign:"right",
buttonAlign:"center",
items:[{
layout : 'form',
border : false,
items : [{
xtype:"textfield",
id:"accountinfoname",
columnWidth : .3,
layout:"form",
fieldLabel:"账号"
}]},{
layout : 'form',
border : false,
items : [{
xtype:"textfield",
id:"role",
columnWidth : .3,
layout:"form",
fieldLabel:"角色"
}]
},{
layout : 'form',
border : false,
items : [{
xtype:"combo",
id: "department",
store: dataforsex,
hiddenName: "id", //隐式值,form获取该组件时使用此值,
displayField: "val", //显示值,用于在页面表示的值
mode: 'remote', //数据获取来源方式,这里表示远程下载
forceSelection: true,
blankText: '', //设置空白默认值
emptyText: '请选择类型', //设置默认值
editable: false,
triggerAction: 'all',
allowBlank: true,
fieldLabel: '所属部门'
}]
}],
buttons:[{
xtype:"button",
//点击事件处理
handler: send,
text:"查询"
},
{xtype:"button",
handler:reset,//点击事件处理
text:"重置"
}]
}]
});
//重置事件处理
function reset(){
formdiv.getForm().reset();
}
//网格数据grid
//网格数据缓存
var dataforgrid=new Ext.data.JsonStore({
//autoLoad :true,
root:"data",
totalProperty:"all",
fields:["id","accountinfoname","password","role","department_"],//数据格式,对映grid中dataindex的值
url:"../accountinfo/accountlist_0" //向服务器请求数据
});
var cm=new Ext.grid.CheckboxSelectionModel({
singleSelect:true//grid数据行的单多选属性
});
//查询事件处理
function send(){
Ext.Msg.alert("title",Ext.getDom("department").hiddenValue
);
dataforgrid.load({params:{
start:0,
limit:5,
accountinfoname:Ext.getDom("accountinfoname").value,
role:Ext.getDom("role").value,
department_:Ext.getDom("department").value
}});
}
var grid = new Ext.grid.GridPanel({
//grid面板前端工具条
tbar:new Ext.PagingToolbar({
pageSize:5,
displayInfo : true,
displayMsg : '显示第 {0} 条到 {1} 条记录,一共 {2} 条记录',
emptyMsg : '没有记录',
store:dataforgrid,
items:[{
xtype:"button",
width:"50",
//点击事件处理
handler: function add(){
window.location.href ='../accountinfo/add';
},
text:"新增"
},{
xtype:"button",
width:"50",
//点击事件处理
handler: function edit(){
if(grid.getSelectionModel().getCount()==0){
Ext.Msg.alert("提示","请选择一项修改");
}
else{
window.location.href ='../accountinfo/edit_'+grid.getSelectionModel().getSelected().id;
//请求服务器处理edit事件
}
},
text:"修改"
},{xtype: 'tbseparator'},
{xtype:"button",
width:"50",
handler:function dele(){
if(grid.getSelectionModel().getCount()==0){
Ext.Msg.alert("提示","请选择一项修改");
}
else{
var url='../accountinfo/delete_'+grid.getSelectionModel().getSelected().id;
Ext.Ajax.request({
url: url,
success: function(response){
dataforgrid.remove(grid.getSelectionModel().getSelected());
},
failure: function(){
Ext.Msg.alert("错误","删除出错,请重试。");
}
});
//请求服务器处理edit事件
}
},//点击事件处理
text:"删除"
}]
}),
renderTo:"griddiv",//渲染到页面div标签id="griddiv"的地方
store: dataforgrid, //加载数据
columns: [
new Ext.grid.RowNumberer(),
cm,
//注意dataindex 对载入的store数据字段名。
{id:"id", width: 200, hidden :true, dataIndex: 'id'},
{ header: "账号", width: 200, sortable: true, dataIndex: 'accountinfoname'},
{ header: "密码", width: 200, sortable: true, dataIndex: 'password'},
{ header: "角色", width: 200, sortable: true, dataIndex: 'role'},
{ header: "所属部门", width: 200, sortable: true, dataIndex: 'department_'}
],
sm: cm,
height:300
});
dataforgrid.load({params : {start:0,limit:5}});
});
</script>
</body>
</html>