1. 登陆页面 index.jsp
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<head>
<title>欢迎使用XX</title>
<link rel="stylesheet" type="text/css" href="extjs4/resources/css/ext-all.css" />
<script type="text/javascript" src="extjs4/bootstrap.js"></script>
<script type="text/javascript" src="extjs4/ext-all.js"></script>
<script type="text/javascript" src="extjs4/ext-lang-zh_CN.js"></script>
<style type="text/css" title="currentStyle" media="screen" mce_bogus="1">
#divcenter{ /*让div居中*/
position:absolute;
top:50%;
left:50%;
width:300px;
height:300px;
margin-top:-150px; /*注意这里必须是DIV高度的一半*/
margin-left:-150px; /*这里是DIV宽度的一半*/
}
</style>
</head>
<body>
<div id="divcenter">
<div id="form"></div>
</div>
</body>
<script type="text/javascript">
Ext.onReady(function(){
Ext.QuickTips.init();
var loginForm = new Ext.form.Panel({
title: '登录', //窗口标题
frame : true,
width: 350,
renderTo : 'form',
bodyStyle:'padding:5px 5px 0',
border : false,
fieldDefaults: {
msgTarget: 'side',
labelWidth: 50
},
defaultType: 'textfield',
defaults: {anchor: '100%' },
items:[{
fieldLabel : '用户名',
name : 'user.username',
},{
name : 'user.password',
fieldLabel: '密码',
inputType : 'password'
}],
buttons:[{
text : '登录',
handler : login
},{
text : '重置',
handler : reset
}]
})
function login(){
loginForm.getForm().submit({
clientValidation : true, //进行客户端验证
url : 'logonAction', //Action
method : 'post', //请求方式
success : function(form,action){
Ext.Msg.alert('登陆成功',action.result.msg);
//登陆成功后 的操作 如页面跳转等
//document.location="logonsuccess.jsp";
},
failure: function(form,action){
Ext.Msg.alert('登陆失败',action.result.msg);
}
})
}
function reset(){
loginForm.form.reset();
}
});
</script>
</html>
2.logonAction
package logon;
import com.opensymphony.xwork2.ActionSupport;
public class LogonAction extends ActionSupport {
private User user;
private String msg; //返回给ext的结果信息
private boolean success; //返回给ext的标志， 这里要设置为boolean
@Override
public String execute() throws Exception {
if(user.getUsername()!=null && user.getPassword()!=null){
if(user.getUsername().equals("GuoJing") && user.getPassword().equals("888888")){
this.setMsg("欢迎你，郭靖！");
this.setSuccess(true);
}else{
this.setMsg("用户名或者密码不正确");
this.setSuccess(false);
}
}else{
this.setMsg("请输入用户名和密码");
this.setSuccess(false);
}
return SUCCESS;
}
public String getMsg() {
return msg;
}
public void setMsg(String msg) {
this.msg = msg;
}
public boolean isSuccess() {
return success;
}
public void setSuccess(boolean success) {
this.success = success;
}
public User getUser() {
return user;
}
public void setUser(User user) {
this.user = user;
}
}
4.注意所需要的jar包
分享到：
相关推荐
这是一个基于ExtJS、Struts2和JSON的登录实例，适合初学者学习Web应用程序开发。这个实例演示了如何将前端的JavaScript框架ExtJS与后端的Java MVC框架Struts2结合，通过JSON进行数据交换实现用户登录功能。下面将...
Struts2和ExtJS4是两个非常重要的Java Web开发框架，它们在构建高效、用户友好的Web应用程序中发挥着关键作用。在这个"Struts2+ExtJS4登录源码"项目中，我们可以深入理解这两个框架如何协同工作以实现一个基本的用户...
在这个项目中，JSON作为前后端数据交换的载体，用于在Struts2或Spring与ExtJS之间传递登录验证结果、密码修改信息等数据。 6. **邮件发送**：为了实现找回密码的功能，项目可能集成了邮件服务，当用户忘记密码时，...
通过以上步骤，我们可以将EXTJS的美观界面和Struts2的强大后台逻辑结合，实现一个完整的登录功能。这种整合方式在实际项目中非常常见，可以为开发者提供高效的开发效率和良好的用户体验。在实际操作中，开发者还需要...
EXTJS + SSH 构建的登录系统是一种常见的前端与后端结合的应用开发方式。EXTJS 是一个基于 JavaScript 的富客户端框架，它提供了丰富的组件库，用于构建用户界面，特别是企业级应用。SSH 框架则由 Spring、Struts 和...
extjs4是权限 网络分享资料中修改而来。 extjs4+ spring3 + hibernate3.3+ struts2.1.8 + mysql5.04+ xp + myEclipse 8.5 测试通过 。 extjsdemo.rar
本示例中，EXTJS、Struts2和JSON共同用于制作一个登录窗口。 首先，我们需要在项目中引入必要的库文件，如描述中所示，包括Struts2的核心库和其他依赖库，例如Commons-logging、Freemarker、Ognl等。这些库文件是...
这个"struts2+spring+ibatis+exejs登陆小例子"是一个整合了这四大框架实现用户登录功能的实践项目。下面将分别介绍这些框架的核心概念以及它们在登录系统中的应用。 首先，Struts2是一个基于MVC（Model-View-...
EXTJS3.0登录DEMO是一个基于EXTJS框架的示例项目，展示了如何将EXTJS与STRUTS2、SPRING和IBATIS等流行Java技术整合，构建一个完整的Web应用程序。EXTJS是一个用于创建富客户端界面的JavaScript库，而STRUTS2、SPRING...
4. **ExtJS**：ExtJS是一个强大的JavaScript库，用于创建富客户端Web应用。在这个例子中，它被用来构建登录界面，包括输入字段、按钮和可能的验证提示，提供用户友好的交互体验。 5. **整合过程**：SSH整合的关键...
最近自己动手做了一个后台使用struts2+Hibernate+Spring 前台使用extjs的工程当作练习。工程实现的功能很简单，就是用户登陆后，可以将笔记内容记录到系统里。后续可以通过日期或者内容进行查询和修改。 主要的练习...
用户登陆身份验证 随机彩色防识别验证码 内置管理员账户，可以创建、删除、修改用户，并查看用户列表和单个用户详情 普通用户账户，记录用户名和密码在SQL数据库中，支持用户头像上传 普通用户能实现发新帖、...
2. **Ajax通信**：当用户进行操作时，例如点击编辑或删除，ExtJS会通过Ajax异步请求将指令发送到后台的Struts2 Action。 3. **Struts2 Action**：接收到请求后，Struts2 Action根据请求类型调用相应的业务逻辑方法...
2. **Struts框架**：Struts是基于MVC（Model-View-Controller）设计模式的Java Web框架，它帮助开发者更好地组织和管理应用程序的各个部分。在WebQQ Java版中，Struts负责接收和处理用户的请求，调用后台服务进行...
Anynote是一个基于extjs3.3、struts1.3.10、spring2.5、ibatis-2.3.4构建的个人信息管理系统(支持多用户)。主要功能包括：1、待办事项；2、**常笔记；3、阅读器；4、个人相册；5、账目理财。 Anynote目前最新版本...
系统采用Ajax（前端）+Struts（后台）+存储过程（数据库）的设计，其中EXTjs用于前端界面组件，Servlet处理异步请求，Struts管理页面逻辑。存储过程用于优化数据库操作。 3.2 前端页面结构 前端页面分为用户管理、...