Extjs登录（用到DB）

来源：互联网发布：java中类的生命周期编辑：程序博客网时间：2024/06/05 00:57

这是第一次用Extjs ，肯定很多漏洞，写给自己的，万一忘记了。。演示-------------如下：

[plain] view plaincopyprint?

Extjs版本：3.3.0
1 建表
use Barcode
/* (此表為了測試自己添加)
EL_User :表名
Id 自動增長類型的主鍵
UserName 用戶名
Password 密碼
NickName 昵稱
Level 級別（普通用戶或管理員）
*/
drop table EL_User
create table EL_User(
Id int identity(1,1)primary key,
UserName nvarchar(30),
Password nvarchar(20),
NickName nvarchar(30),
Level int
)
insert into EL_User values('舒婷','123456','微笑釋懷',1) --level級別 0代表普通用戶，1
代表高級用戶
insert into EL_User values('Tom','123123','BigMan',0)
insert into EL_User values('dog','111111','玫瑰男人',0)
2 登录界面 login.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%>">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="Extjs/3.3.0/resources/css/ext-
all.css"/>
<script type="text/javascript" src="Extjs/3.3.0/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="Extjs/3.3.0/ext-all.js"></script>
<script type="text/javascript">
Ext.onReady(function(){
Ext.QuickTips.init();
Ext.form.Field.prototype.msgTarget="qtip";
var loginform = new Ext.form.FormPanel({
renderTo:'container',
title:'用戶登陆',
labelSeparator:":",
collapsible :true,
width:300,
height:150,
id:'login',
labelWidth: 80,
bodyStyle: 'padding:5px 5px 0 0',
border: false,
name:'login',
frame:true,
defaults:{width:178,xtype:'textfield'},
items:[
new Ext.form.TextField({
frame:true,
fieldLabel:"用户名",
name:'userName',
allowBlank:false,
blankText:'用户名不能为空'
}),{
fieldLabel:"密码",
name:'password',
allowBlank:false,
inputType:'password',
blankText:'密码不能为空'
}],
keys:{
key: 13,
fn:login
},
buttons:[{
text:'提交',
handler:login
},{
text:'重置',
handler:function reset(){
loginform.form.reset();
}
}]
});
function login(){
var form=Ext.getCmp("login").getForm();
form.submit({
//clientValidation: true,
url:"/Env_1/BarCode/selectUser.action",
params:{
},
success: function(form, action) {
Ext.Msg.alert('Success', "恭喜，登陆成功！");
location.href = 'index.jsp';
},
failure: function(form, action) {
switch (action.failureType) {
case Ext.form.Action.CLIENT_INVALID:
Ext.Msg.alert('Failure', 'Form fields may not be submitted with
invalid values');
break;
case Ext.form.Action.CONNECT_FAILURE:
Ext.Msg.alert('Failure', 'Ajax communication failed');
break;
case Ext.form.Action.SERVER_INVALID:
Ext.Msg.alert('Failure', "您的输入有误，请核实后重新输入");
loginform.form.reset();
}
}
});
}
})
</script>
</head>
<body>
<div id="outer" align="center">
<br><br><br><br><br><br><br><br>
<div id="container"></div>
</div>
</body>
</html>
3 Model下的EL_User.java（实体类）
package com.barcode.Model;
import javax.persistence.Column;
import javax.persistence.Entity;
import javax.persistence.Id;
import javax.persistence.Table;
@Entity
@Table(name="EL_User")
public class EL_User {
private int Id;
private String UserName;
private String Password;
private String NickName;
private int level;
@Id
@Column(name="Id")
public int getId() {
return Id;
}
public void setId(int id) {
Id = id;
}
@Column(name="UserName")
public String getUserName() {
return UserName;
}
public void setUserName(String userName) {
UserName = userName;
}
@Column(name="Password")
public String getPassword() {
return Password;
}
public void setPassword(String password) {
Password = password;
}
@Column(name="NickName")
public String getNickName() {
return NickName;
}
public void setNickName(String nickName) {
NickName = nickName;
}
@Column(name="Level")
public int getLevel() {
return level;
}
public void setLevel(int level) {
this.level = level;
}
}
dao层
@Repository
public class ELLoginDao {
private HibernateTemplate hibernateTemplate;
@SuppressWarnings("unused")
@Autowired
private void setHibernateTemplate (SessionFactory sessionFactory){
this.hibernateTemplate =new HibernateTemplate(sessionFactory);
}
@SuppressWarnings("unchecked")
public List isHaveUser(String username,String password){
String hql = "from ELUser u where u.userName = '"+username+"' and
u.password = '"+password+"'";
System.out.println("hql"+hql);
return this.hibernateTemplate.find(hql);
}
}
4 service层
package com.barcode.Service;
import java.util.Iterator;
import java.util.List;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;
import com.barcode.DAO.EL_UserDAO;
import com.barcode.Model.EL_User;
@Service
public class EL_UserService {
@SuppressWarnings("unused")
private EL_UserDAO el_UserDAO;
@Autowired
public void setEl_UserDAO(EL_UserDAO el_UserDAO) {
this.el_UserDAO = el_UserDAO;
}
@Transactional("barcode")
public boolean selectUser(String username,String password){
List<EL_User>list= this.el_UserDAO.selectUser(username,password);
if(list.size()==0){
return false;
}else{
return true;
}
}
}
5 web层
package com.barcode.Web;
import java.util.Enumeration;
import java.util.HashMap;
import java.util.Map;
import javax.servlet.http.HttpServletRequest;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import com.barcode.Model.EL_User;
import com.barcode.Service.EL_UserService;
@Controller
public class EL_UserController {
private EL_UserService el_UserService;
@Autowired
public void setEl_UserService(EL_UserService el_UserService) {
this.el_UserService = el_UserService;
}
@ModelAttribute("user")
public EL_User formbackObject(Integer id, HttpServletRequest request) throws
Exception{
//獲得更改的各項屬性
Enumeration enumeration = request.getParameterNames();
System.out.println(enumeration.hasMoreElements());
while (enumeration.hasMoreElements()) {
String paramName = (String) enumeration.nextElement();
System.out.println("request parameter [" + paramName + "]=" +
request.getParameter(paramName));
}
EL_User user=null;
if(id!=null&&id!=0){
//ug = us.getUsefulGroup(id);
}else{
user = new EL_User();
}
return user;
}
@SuppressWarnings("unchecked")
@RequestMapping(value="BarCode/selectUser.action")
public @ResponseBody Map<String,? extends Object> selectUser(@ModelAttribute
("user") EL_User user,HttpServletRequest request){
System.out.println(user.getUserName());
System.out.println(user.getPassword());
String username=user.getUserName();
String password=user.getPassword();
boolean boo=this.el_UserService.selectUser(username,password);
Map map=new HashMap<String,Object>();
if(boo){
map.put("data",user);
map.put("success",true);
map.put("message","You are successful !!");
}else{
map.put("failure", false);
map.put("message","username or password is error!");
}
return map;
}
}

 Extjs版本：3.3.0 1 建表use  Barcode/*        (此表為了測試自己添加)          EL_User :表名          Id 自動增長類型的主鍵          UserName 用戶名          Password 密碼          NickName 昵稱          Level 級別（普通用戶或管理員）*/drop table EL_User create table EL_User(          Id int identity(1,1)primary key,          UserName nvarchar(30),          Password nvarchar(20),          NickName nvarchar(30),          Level int     )insert into EL_User values('舒婷','123456','微笑釋懷',1) --level級別 0代表普通用戶，1代表高級用戶insert into EL_User values('Tom','123123','BigMan',0)insert into EL_User values('dog','111111','玫瑰男人',0)2 登录界面 login.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%>">        <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">    <meta http-equiv="description" content="this is my page">    <meta http-equiv="content-type" content="text/html; charset=UTF-8">           <link rel="stylesheet" type="text/css" href="Extjs/3.3.0/resources/css/ext-all.css"/>    <script type="text/javascript" src="Extjs/3.3.0/adapter/ext/ext-base.js"></script>    <script type="text/javascript" src="Extjs/3.3.0/ext-all.js"></script>    <script type="text/javascript"> Ext.onReady(function(){       Ext.QuickTips.init();       Ext.form.Field.prototype.msgTarget="qtip";       var loginform = new Ext.form.FormPanel({           renderTo:'container',           title:'用戶登陆',           labelSeparator:":",           collapsible :true,           width:300,           height:150,           id:'login',           labelWidth: 80,           bodyStyle: 'padding:5px 5px 0 0',           border: false,           name:'login',           frame:true,           defaults:{width:178,xtype:'textfield'},           items:[               new Ext.form.TextField({               frame:true,               fieldLabel:"用户名",               name:'userName',               allowBlank:false,               blankText:'用户名不能为空'           }),{               fieldLabel:"密码",               name:'password',               allowBlank:false,               inputType:'password',               blankText:'密码不能为空'           }],          keys:{               key: 13,               fn:login           },           buttons:[{               text:'提 交',               handler:login           },{              text:'重 置',            handler:function reset(){                 loginform.form.reset();              }           }]       });       function login(){        var form=Ext.getCmp("login").getForm();        form.submit({          //clientValidation: true,          url:"/Env_1/BarCode/selectUser.action",          params:{                    },          success: function(form, action) {          Ext.Msg.alert('Success', "恭喜，登陆成功！");              location.href = 'index.jsp';          },          failure: function(form, action) {            switch (action.failureType) {                case Ext.form.Action.CLIENT_INVALID:                    Ext.Msg.alert('Failure', 'Form fields may not be submitted with invalid values');                    break;                case Ext.form.Action.CONNECT_FAILURE:                    Ext.Msg.alert('Failure', 'Ajax communication failed');                    break;                case Ext.form.Action.SERVER_INVALID:                   Ext.Msg.alert('Failure', "您的输入有误，请核实后重新输入");                   loginform.form.reset();              }          }        });     }          }) </script>  </head><body>  <div id="outer" align="center">  <br><br><br><br><br><br><br><br>     <div id="container"></div>  </div>  </body></html>3 Model下的EL_User.java（实体类）package com.barcode.Model; import javax.persistence.Column;import javax.persistence.Entity;import javax.persistence.Id;import javax.persistence.Table;@Entity@Table(name="EL_User")public class EL_User {    private int Id;    private String UserName;    private String Password;    private String NickName;    private int level;    @Id    @Column(name="Id")    public int getId() {        return Id;    }    public void setId(int id) {        Id = id;    }    @Column(name="UserName")    public String getUserName() {        return UserName;    }    public void setUserName(String userName) {        UserName = userName;    }    @Column(name="Password")    public String getPassword() {        return Password;    }    public void setPassword(String password) {        Password = password;    }    @Column(name="NickName")    public String getNickName() {        return NickName;    }    public void setNickName(String nickName) {        NickName = nickName;    }    @Column(name="Level")    public int getLevel() {        return level;    }    public void setLevel(int level) {        this.level = level;    }}dao层@Repositorypublic class ELLoginDao {            private HibernateTemplate hibernateTemplate;          @SuppressWarnings("unused")          @Autowired          private void setHibernateTemplate (SessionFactory sessionFactory){                    this.hibernateTemplate =new HibernateTemplate(sessionFactory);          }                    @SuppressWarnings("unchecked")          public List isHaveUser(String username,String password){                    String hql = "from ELUser u where u.userName = '"+username+"' and u.password = '"+password+"'";                    System.out.println("hql"+hql);                     return this.hibernateTemplate.find(hql);                                                             }} 4 service层package com.barcode.Service; import java.util.Iterator;import java.util.List; import org.springframework.beans.factory.annotation.Autowired;import org.springframework.stereotype.Service;import org.springframework.transaction.annotation.Transactional; import com.barcode.DAO.EL_UserDAO;import com.barcode.Model.EL_User; @Servicepublic class EL_UserService {    @SuppressWarnings("unused")    private EL_UserDAO el_UserDAO;    @Autowired    public void setEl_UserDAO(EL_UserDAO el_UserDAO) {        this.el_UserDAO = el_UserDAO;    }    @Transactional("barcode")    public boolean selectUser(String username,String password){        List<EL_User>list= this.el_UserDAO.selectUser(username,password);        if(list.size()==0){            return false;        }else{            return true;        }    }}5 web层package com.barcode.Web; import java.util.Enumeration;import java.util.HashMap;import java.util.Map; import javax.servlet.http.HttpServletRequest; import org.springframework.beans.factory.annotation.Autowired;import org.springframework.stereotype.Controller;import org.springframework.web.bind.annotation.ModelAttribute;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.ResponseBody; import com.barcode.Model.EL_User;import com.barcode.Service.EL_UserService; @Controllerpublic class EL_UserController {        private EL_UserService el_UserService;    @Autowired     public void setEl_UserService(EL_UserService el_UserService) {        this.el_UserService = el_UserService;    }    @ModelAttribute("user")    public EL_User formbackObject(Integer id, HttpServletRequest request) throws Exception{        //獲得更改的各項屬性        Enumeration enumeration = request.getParameterNames();        System.out.println(enumeration.hasMoreElements());        while (enumeration.hasMoreElements()) {             String paramName = (String) enumeration.nextElement();             System.out.println("request parameter [" + paramName + "]=" +             request.getParameter(paramName));        }        EL_User user=null;        if(id!=null&&id!=0){            //ug = us.getUsefulGroup(id);        }else{            user = new EL_User();        }        return user;    }        @SuppressWarnings("unchecked")    @RequestMapping(value="BarCode/selectUser.action")    public @ResponseBody Map<String,? extends Object> selectUser(@ModelAttribute("user") EL_User user,HttpServletRequest request){        System.out.println(user.getUserName());        System.out.println(user.getPassword());        String username=user.getUserName();        String password=user.getPassword();        boolean boo=this.el_UserService.selectUser(username,password);        Map map=new HashMap<String,Object>();        if(boo){        map.put("data",user);        map.put("success",true);        map.put("message","You are successful !!");        }else{            map.put("failure", false);            map.put("message","username or password is error!");        }        return map;    }}