29. ExtJs - Struts2 整合(1) - 登录页面
转自：https://yarafa.iteye.com/blog/729197
初学 ExtJS，在此记录下学习过程中的点点滴滴，以备不时只需，也希望能给跟我一样的菜鸟一些帮助，老鸟请忽略。如有不当之处，欢迎指正。
开发环境：
MyEclipse 6.5
Struts 2.1.8
ExtJs 3.0
1. 准备工作
首先需要配置 Struts2 和 ExtJS，具体操作这里不再多说。
2. 登录页面
<%@ page language="java" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>login Page Test-2</title> <!-- 引入ExtJS所需文件-->
<link rel="stylesheet" type="text/css" href="js/extjs/resources/css/ext-all.css" />
<script type="text/javascript" src="js/extjs/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="js/extjs/ext-all.js"></script>
<script type="text/javascript">
var loginForm;
Ext.onReady(function() {
Ext.BLANK_IMAGE_URL = 'js/extjs/resources/images/default/s.gif';
Ext.QuickTips.init(); // 定义一个 FormPanel 对象
loginForm = new Ext.FormPanel({
width: 400,
frame: true,
renderTo: "loginForm",
title: "登录",
method: "POST",
monitorValid: true, // 该属性表示表单在通过验证之前提交按钮无效
labelWidth: 50, // 标签宽度
labelAlign: "left", // 标签的对齐方式
labelPad: 0, // 标签与输入框的间隔
buttonAlign: 'center', // 底部按钮居中对齐 items: [
{
xtype: "textfield",
fieldLabel: "用户名",
allowBlank: false, // 是否允许为空, 默认为 true
blankText: "用户名不能为空", // 显示错误提示信息
name: "user.username", // name 属性应与 Struts2 Action 中的属性保持一致
id: "username",
width: 300
},
{
xtype: "textfield",
inputType: "password",
fieldLabel: "密 码",
allowBlank: false,
blankText: "密码不能为空",
name: "user.password",
id: "password",
width: 300
}
],
buttons: [
{
text: "登 录",
formBind: true,
handler: doLogin
},
{
text: "重 置",
handler: doReset
}
],
keys: [
{
key: [10, 13],
fn: doLogin
}
], // 表单不使用AJAX方式提交
onSubmit: Ext.emptyFn,
submit: function() {
this.getEl().dom.action = "login.action";
this.getEl().dom.submit();
}
});
}); // 登录
function doLogin() {
if(loginForm.form.isValid()) {
loginForm.form.submit();
}
} // 重置
function doReset() {
loginForm.form.reset();
}
</script>
</head> <body>
<div id="loginForm" style="margin: 100px">
</div>
</body>
</html>
页面效果如下图所示：
3. Java 类编辑
3.1 User 类
/***********************************************************************
* <p>Project Name: extjs</p>
* <p>File Name: com.thu.afa.extjs.bean.User.java</p>
* <p>Copyright: Copyright (c) 2010</p>
* <p>Company: <a href="http://afa.thu.com">http://afa.thu.com</a></p>
***********************************************************************/
package com.thu.afa.extjs.bean; import java.io.Serializable; /**
* <p>Class Name: User</p>
* <p>Description: </p>
* @author Afa
* @date Aug 4, 2010
* @version 1.0
*/
public class User implements Serializable
{
private static final long serialVersionUID = 2851358330179740778L; private String username;
private String password;
public String getUsername()
{
return username;
}
public void setUsername(String username)
{
this.username = username;
}
public String getPassword()
{
return password;
}
public void setPassword(String password)
{
this.password = password;
}
}
3.2 Action 类
/***********************************************************************
* <p>Project Name: extjs</p>
* <p>File Name: com.thu.afa.extjs.action.UserAction.java</p>
* <p>Copyright: Copyright (c) 2010</p>
* <p>Company: <a href="http://afa.thu.com">http://afa.thu.com</a></p>
***********************************************************************/
package com.thu.afa.extjs.action; import com.opensymphony.xwork2.ActionSupport;
import com.thu.afa.extjs.bean.User; /**
* <p>Class Name: UserAction</p>
* <p>Description: </p>
* @author Afa
* @date Aug 4, 2010
* @version 1.0
*/
public class UserAction extends ActionSupport
{
private static final long serialVersionUID = 3093253656888703000L; private User user; public User getUser()
{
return user;
} public void setUser(User user)
{
this.user = user;
} @Override
public String execute() throws Exception
{
return ("test".equals(user.getUsername()) && "test".equals(user.getPassword())) ? SUCCESS : INPUT;
}
}
4. 配置文件 struts.xml
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.1.7//EN"
"http://struts.apache.org/dtds/struts-2.1.7.dtd">
<struts>
<package name="com.thu.afa.extjs" extends="struts-default">
<action name="login" class="com.thu.afa.extjs.action.UserAction">
<result name="success">/result.jsp</result>
<result name="input">/login.jsp</result>
</action>
</package>
</struts>
5. 部署运行
开发过程完成，部署运行即可。
6. 注意事项
6.1 表单元素的 name 属性
- name: "user.username", // name 属性应与 Struts2 Action 中的属性保持一致
6.2 表单的提交地址
- this.getEl().dom.action = "login.action";
29. ExtJs - Struts2 整合(1) - 登录页面的更多相关文章
- java web: eclipse & maven & jetty & struts2 & mysql = 简单登录页面
第一次接触java web开发,花费了一天半的时间,写了个简单的登录页面,以此文为记. 开发工具 Eclipse Luna Release (4.4.0) 已集成maven,maven目前的体会就是管 ...
- struts2拦截器实现session超时返回登录页面（iframe下跳转到其父页面）
需求:session超时时,返回登录页面,由于页面嵌套在iframe下,因此要跳转到登录页面的父页面,但是首页,登录页面等不需要进行跳转 实现: java文件:SessionIterceptor.ja ...
- struts2整合spring应用实例
我们知道struts1与spring整合是靠org.springframework.web.struts.DelegatingActionProxy来实现的,以下通过具体一个用户登录实现来说明stru ...
- php 整合 微博登录
现在很多网站都整合了便捷的第三方登录,如QQ登录.新浪微博.搜狐.网易等,为用户提供不少方便和节约时间.我们可以选择使用JS或SDK实现第三方提供用户授权API,本文主要讲解 JAVA SDK 新浪微 ...
- Struts2 整合jQuery实现Ajax功能(1)
技术领域非常多东西流行,自然有流行的道理.这几天用了jQuery,深感有些人真是聪明绝顶,能将那么多技术融合的如此完美. 首先明白个概念: jQuery是什么:是使用javascript语言开发的,用 ...
- MyBatis数据持久化（十一）Mybatis3、Spring4、Struts2整合开发
上一节我们將Mybatis和Spring4进行整合,本节向大家介绍Mybatis在Web开发中的应用,并与主流的MVC框架Struts2进行整合. 我们首先需要获取Struts2框架,Struts2官 ...
- 无废话ExtJs 入门教程十六[页面布局：Layout]
无废话ExtJs 入门教程十六[页面布局:Layout] extjs技术交流,欢迎加群(201926085) 首先解释什么是布局: 来自百度词典的官方解释:◎ 布局 bùjú: [distributi ...
- 基于Struts2框架实现登录案例 之 使用Struts2标签库简化表单+继承ActionSupport完成输入交验
一,使用Struts2标签库简化表单 在文章[基于Struts2框架实现登录案例]的基础上,通过使用Struts标签库可以简化登录页面login2.jsp <%@ page language=& ...
- 基于Struts2框架实现登录案例
一,准备工作 1)新建web项目,并导入Struts2jar文件和配置web.xml文件. struts2 jar文件 web.xml文件 <?xml version="1.0&qu ...
随机推荐
- odoo权限配置讲解2
今天我们在来讲解一下odoo中配合使用公司开发的权限配置模块,简单配置odoo权限的操作说明 接着上篇讲到的,昨天我们只是做了一个简单的表单模型的筛选规则 今天来讲解一下如何在创建内贸报价单的时候,在 ...
- NormalMap 法线贴图
法线贴图+纹理贴图(细节明显) 纹理贴图 法线贴图 法线贴图 存储法线的一张贴图,归一化的法线的 xyz 的值被映射成为对应的 RGB 值.归一化的法线值为[-1,1],RGB的每一个分量为无符号的8 ...
- 关于自定义checkbox-radio标签的样式的方法（label 和 background-position理解）
label label标签有一个很好的作用就是扩大表单控件元素的点击区域. 一般有两种方法可以达到效果:(1)使用label标签包裹表单控件(2)设置label标签的for属性和表单的id属性一致 这 ...
- python之字符串处理 2014-4-5
#字符串 p62 13:20pm-15:20 上一章讲的所有的序列化操作对于字符串同样适用 不过字符串不可变 所以无法使用分片赋值 1.字符串格式化 >>> format=" ...
- Python模块：Re模块、附软件开发目录规范
Re模块:(正则表达式) 正则表达式就是字符串的匹配规则 正则表达式在多数编程语言里都有相应的支持,Python里面对应的模块时re 常用的表达式规则:(都需要记住) “ . ” # 默认匹配除 ...
- Codeforces698C. LRU
n<=20种东西,有个大小k<=n的箱子,每次会以固定的概率从所有东西里选一种,若箱子里有空位且这种东西没出现过就丢进去,若箱子满了且这种东西没出现过就把最早访问过的一个丢掉,(只要在每次 ...
- 【转】Intellij IDEA 快捷键大全
IntelliJ Idea 常用快捷键列表 Ctrl+Shift + Enter,语句完成“!”,否定完成,输入表达式时按 “!”键Ctrl+E,最近的文件Ctrl+Shift+E,最近更改的文件Sh ...
- Linux下汇编语言学习笔记17 ---
这是17年暑假学习Linux汇编语言的笔记记录,参考书目为清华大学出版社 Jeff Duntemann著 梁晓辉译<汇编语言基于Linux环境>的书,喜欢看原版书的同学可以看<Ass ...
- 权限框架之Shiro详解(非原创)
文章大纲 一.权限框架介绍二.Shiro基础介绍三.Spring Boot整合Shiro代码实战四.项目源码与资料下载五.参考文章 一.权限框架介绍 1. 什么是权限管理 权限管理属于系统安全 ...
- fastjson过滤器简单记录
fastjson过滤器,该字段可以将转化的json字段遍历,方便实用 1 /** * 通用输出json * @param object * @return json字符串 */ public Stri ...