ExtJS做的一个员工信息增删改查，分页功能
2019-05-09 本文已影响0人
激扬文字
ExtJS做的一个员工信息增删改查，分页功能
ExtJs:代码挺多的，部分功能同事帮实现
<%@ page language='java' contentType='text/html; charset=utf-8'
pageEncoding='utf-8'%>
<!DOCTYPE html PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN' '[http://www.w3.org/TR/html4/loose.dtd](http://www.w3.org/TR/html4/loose.dtd)'>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8'>
<title>员工管理</title>
<link rel='stylesheet' type='text/css' href='ext3.0/resources/css/ext-all.css' />
<script type='text/javascript' src='ext3.0/adapter/ext/ext-base.js'></script>
<script type='text/javascript' src='ext3.0/ext-all.js'></script>
</head>
<body>
<script type='text/javascript'>
var clientWidth = document.documentElement.clientWidth;
var clientHeight = document.documentElement.clientHeight ;
var _cb;
var _userStore;
var _grid;
var win;
var userForm;
var record;
Ext.onReady(function(){
Ext.QuickTips.init();
Ext.BLANK_IMAGE_URL='ext3.0/resources/images/default/s.gif';
function submitForm(){
if(userForm.isAdd){
userForm.form.submit({
clientValidation:true,
waitMsg:'正在提交数据',
waitTitle:'提示',
url:'/fileform/user_addUser.action',
method:'POST',
success:function(form,action){
Ext.Msg.alert("提示","新增成功！");
win.hide();
_grid.getStore().reload();
}
});
}else{
userForm.form.submit({
clientValidation:true,
waitMsg:'正在提交数据',
waitTitle:'提示',
url:'/fileform/user_updateUser.action',
method:'POST',
success:function(form,action){
Ext.Msg.alert("提示","修改成功！");
win.hide();
_grid.getStore().reload();
}
});
}
}
function addUser(){
userForm.form.reset();
userForm.isAdd=true;
win.setTitle("新增员工");
win.show();
}
function updateUser(){
var count = _cb.getCount();
if(count==0){
Ext.Msg.alert("提示","请选择一条记录进行修改");
return ;
}
if(count>1){
Ext.Msg.alert("提示","只能选择一条记录进行修改");
return ;
}
userForm.isAdd=false;
userForm.form.reset();
win.setTitle("修改信息");
win.show();
/* Ext.getCmp("empno").setValue(_cb.getSelected().get("empno"));
Ext.getCmp("ename").setValue(_cb.getSelected().get("ename"));
Ext.getCmp("job").setValue(_cb.getSelected().get("job"));
Ext.getCmp("sal").setValue(_cb.getSelected().get("sal"));
*/
Ext.getCmp("userForm").getForm().loadRecord(record);
}
function delUser(){
var count = _cb.getCount();
if(count==0){
Ext.Msg.alert("提示","请选择一条记录进行删除");
return ;
}
if(count>1){
Ext.Msg.alert("提示","每次只能删除一条记录");
return ;
}
var empno = _cb.getSelected().get("empno");
Ext.MessageBox.confirm("提示","确认删除？" ,function(id){
if(id=="yes"){
Ext.Ajax.request({
method: "POST",
url: '/fileform/user_delUser.action?empno='+parseInt(empno),
success:function(form,action){
Ext.Msg.alert("提示","删除成功！");
_grid.getStore().reload();
}
});
}
});
}
//列表
_userStore=new Ext.data.Store({
autoLoad:true,
reader:new Ext.data.JsonReader({
totalProperty:"total",
root:"results",
id:'ename',
fields :[
{name:"empno"},
{name:"ename"},
{name:"job"},
{name:"sal"},
{name:"deptno"}
]}),
remoteSort:true,
proxy:new Ext.data.HttpProxy({
url:'/fileform/user_userList.action',
method : 'post'
})
});
//查询窗口
var searchButton = new Ext.Action({
icon : '',
cls : 'x-btn-text-icon',
text : '查询',
handler: function(){
var searchName = Ext.getCmp("searchName").getValue();//获得id为searchName文本框的值
_userStore.proxy=new Ext.data.HttpProxy({
url:'/fileform/user_userList.action?ename='+searchName,
method : 'post'
});
_userStore.load();
}
});
var addButton=new Ext.Action({
icon :'',
cls :'x-btn-text-icon',
text:'增加',
handler:function (){
var add = true;
showWin(add);
}
});
var updateButton=new Ext.Action({
icon :'',
cls :'x-btn-text-icon',
text:'修改',
handler:function (){
var add = false;
showWin(add);
}
});
var delButton=new Ext.Action({
icon :'',
cls :'x-btn-text-icon',
text:'删除' ,
handler:delUser
});
var toolbar = new Ext.Toolbar(
[" 员工姓名 ",{
xtype : 'textfield',
id : 'searchName',
name : 'searchName',
width : 200
},'->',
searchButton,'-',
addButton,'-',
updateButton,'-',
delButton]);
var _cb= new Ext.grid.CheckboxSelectionModel({
singleSelect: true,
listeners: {
rowselect: function (sm, row, rec) {
record = rec;
}
}
}),
_grid=new Ext.grid.GridPanel({
applyTo:'panel',
frame:true,
id : 'grid',
height: clientHeight*0.9,
//autoHeight:true,
width: clientWidth*0.9,
tbar:toolbar,
bbar:new Ext.PagingToolbar({
pageSize:10,
store:_userStore,
displayInfo:true,
displayMsg:'显示第{0}条到第{1}条记录,总共{2}条记录',
emptyMsg:'--------<font color="red">没有记录</font>--------'
}),
title: '人员管理',
store:_userStore,
stripeRows:true,
viewConfig:{
autoFill:true
},
sm:_cb,
columns:[
new Ext.grid.RowNumberer(),
_cb,
{
header:'员工编号',
width:40,
dataIndex:'empno' ,
sortable:true
},{
header:'员工姓名',
width:40,
dataIndex:'ename',
sortable:true
},{
header:'员工职位',
width:40 ,
dataIndex:'job' ,
sortable:true
},{
header:'员工薪水',
width:40 ,
dataIndex:'sal' ,
sortable:true
},{
header:'员工部门',
width:40 ,
dataIndex:'deptno' ,
sortable:true
}],
tbar : toolbar
});
_userStore.load();
function showWin(add){
if(!win){
creatWin();
}
if(add){
addUser();
}else{
updateUser();
}
}
function creatWin(){
userForm=new Ext.FormPanel({
labelSeparator:":",
frame:true,
id : 'userForm',
border:false,
items:[{
xtype:'textfield',
width:200,
allowBlank:false,
blankText:'员工姓名不能为空',
name:'ename',
id:'ename',
fieldLabel:'员工姓名',
maxLength:10,
minLength:1
},{
xtype:'textfield',
width:200,
allowBlank:false,
blankText:'员工职位不能为空',
name:'job',
id:'job',
fieldLabel:'员工职位'
},{
xtype:'numberfield',
width:200,
allowBlank:false,
blankText:'员工工资不能为空',
name:'sal',
id:'sal',
fieldLabel:'员工工资'
},{
xtype:'hidden',
name:'empno',
id:'empno'
},{
xtype:'htmleditor',
width:200,
allowBlank:false,
maxValue:'2012-12-12',
minValue:'2002-12-12',
blankText:'员工工资不能为空',
fieldLabel:'员工工资'
}
]
});
win=new Ext.Window({
layout:'fit',
width:380,
closeAction:'hide',
height:250,
resizable:false,
shadow:true,
modal:true,
buttonAlign: 'center',
closable:true,
bodyStyle:'padding:5 5 5 5',
animCollapse:true,
items:[userForm],
buttons:[{
text:'提交',
handler:submitForm
},{
text:'关闭',
handler:function (){
win.hide();
}
} ]
});
}
});
</script>
<div id='panel'></div>
</body>
</html>
Action:增删除改查分页全在里面。
package com.wys.web;
import java.util.List;
import java.util.Random;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import net.sf.json.JSONArray;
import org.apache.struts2.interceptor.ServletRequestAware;
import org.apache.struts2.interceptor.ServletResponseAware;
import com.opensymphony.xwork2.ActionSupport;
public class UserCRUDAction extends ActionSupport implements ServletRequestAware, ServletResponseAware {
private HttpServletResponse response;
private HttpServletRequest request;
private Integer empno;
private String ename;
private String job;
private Integer sal;
private String start;
private String limit;
public String getStart() {
return start;
}
public void setStart(String start) {
this.start = start;
}
public String getLimit() {
return limit;
}
public void setLimit(String limit) {
this.limit = limit;
}
public Integer getEmpno() {
return empno;
}
public void setEmpno(Integer empno) {
this.empno = empno;
}
public String getEname() {
return ename;
}
public void setEname(String ename) {
this.ename = ename;
}
public String getJob() {
return job;
}
public void setJob(String job) {
this.job = job;
}
public Integer getSal() {
return sal;
}
public void setSal(Integer sal) {
this.sal = sal;
}
public void setServletResponse(HttpServletResponse response) {
this.response=response;
}
public void setServletRequest(HttpServletRequest request) {
this.request=request;
}
public String userList()throws Exception{
if(start==null||("").equals(start)){
this.start = "0";
}
if(limit==null||("").equals(limit)){
this.limit = "10";
}
UserDAO dao=new UserDAOImpl();
List<User> users=dao.query(ename,start,limit);
int count = dao.getCount(ename);
System.out.println(count);
JSONArray js=JSONArray.fromObject(users);
StringBuffer sb = new StringBuffer("{total:")
.append(count)
.append(",results:")
.append(js.toString())
.append("}");
response.setHeader("Cache-Control", "no-cache");
response.setContentType("text/json;charset=UTF-8");
response.getWriter().write(sb.toString());
return null;
}
public String addUser()throws Exception{
User u=new User();
u.setEmpno(new Random().nextInt(1000));
u.setEname(ename);
u.setJob(job);
u.setSal(sal);
u.setDeptno(20);
UserDAO dao=new UserDAOImpl();
dao.addUser(u);
response.reset();
response.getWriter().write("{success:true}");
return null;
}
public String updateUser()throws Exception{
User u=new User();
u.setEmpno(empno);
u.setEname(ename);
u.setJob(job);
u.setSal(sal);
UserDAO dao=new UserDAOImpl();
dao.updateUser(u);
response.reset();
response.getWriter().write("{success:true}");
return null;
}
public String delUser()throws Exception{
UserDAO dao=new UserDAOImpl();
dao.delUser(empno);
response.reset();
response.getWriter().write("{success:true}");
return null;
}
}
DAO:
package com.wys.web;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.util.ArrayList;
import java.util.List;
public class UserDAOImpl implements UserDAO {
public List<User> query(String ename,String start,String limit) {
Connection con=null;
PreparedStatement stmt=null;
ResultSet rs=null;
List<User> users=new ArrayList<User>();
//stmt=con.prepareStatement("select empno,ename,job from (select empno,ename,job,rownum r from emp where rownum<?) where r>=?");
int min=Integer.parseInt(start)+1;
int max=min+Integer.parseInt(limit);
StringBuffer sql = new StringBuffer("select empno,ename,job,sal,deptno from (select empno,ename,job,sal,deptno,rownum r from emp where 1=1 ");
if(ename!=null&&!("").equals(ename.trim())){
sql.append(" and ename like '%"+ename.trim()+"%'");
}
sql.append(" and rownum<"+max+") where r>="+min);
System.out.println(sql);
try{
con=DbUtil.getConnection();
stmt=con.prepareStatement(sql.toString());
rs=stmt.executeQuery();
while(rs.next()){
User u=new User();
u.setEmpno(rs.getInt("empno"));
u.setEname(rs.getString("ename"));
u.setJob(rs.getString("job"));
u.setSal(rs.getInt("sal"));
u.setDeptno(rs.getInt("deptno"));
users.add(u);
}
return users;
}catch(Exception e){
e.printStackTrace();
}finally{
}
return null;
}
public void addUser(User u) {
Connection con=null;
PreparedStatement stmt=null;
try{
con=DbUtil.getConnection();
stmt=con.prepareStatement(
"insert into emp(empno,ename,job,sal,deptno) values(?,?,?,?,?)");
stmt.setInt(1, u.getEmpno());
stmt.setString(2, u.getEname());
stmt.setString(3, u.getJob());
stmt.setInt(4, u.getSal());
stmt.setInt(5, u.getDeptno());
stmt.executeUpdate();
}catch(Exception e){
e.printStackTrace();
}finally{
}
}
public void updateUser(User u) {
Connection con=null;
PreparedStatement stmt=null;
try{
con=DbUtil.getConnection();
stmt=con.prepareStatement("update emp set ename=?,job=?,sal=? where empno=?");
stmt.setString(1, u.getEname());
stmt.setString(2, u.getJob());
stmt.setInt(3,u.getSal());
stmt.setInt(4, u.getEmpno());
stmt.executeUpdate();
}catch(Exception e){
e.printStackTrace();
}finally{
}
}
public void delUser(Integer empno) {
Connection con=null;
PreparedStatement stmt=null;
try{
con=DbUtil.getConnection();
stmt=con.prepareStatement("delete from emp where empno=?");
stmt.setInt(1, empno);
stmt.executeUpdate();
}catch(Exception e){
e.printStackTrace();
}finally{
}
}
@Override
public int getCount(String ename) {
Connection con=null;
PreparedStatement stmt=null;
ResultSet rs=null;
int count = 0;
StringBuffer sql = new StringBuffer(" select count(1) cnt from emp where 1=1");
if(ename!=null&&!("").equals(ename.trim())){
sql.append(" and ename like '%"+ename.trim()+"%'");
}
System.out.println(sql);
try{
con=DbUtil.getConnection();
stmt= con.prepareStatement(sql.toString());
rs=stmt.executeQuery();
while(rs.next()){
count = rs.getInt("cnt");
}
return count;
}catch(Exception e){
e.printStackTrace();
}finally{
}
return 0;
}
}
s2:
<action name="user_*" method="{1}" class="com.wys.web.UserCRUDAction">
</action>
