ExtとStruts 2を組み合わせて使用

10500 ワード
apache jsp xml struts ext
Ext js 2.2登録(struts 2+json)方法
1、struts 2クラスパッケージ
Commons-logging-1.0.4.jar
Freemarker-2.3.12.jar
Ognl-2.6.11.jar
Struts2-core-2.1.2.jar
Xwork-2.1.1.jar
Commons-fileupload-1.2.1.jar
Commons-io-1.3.2.jar
2、web.xml 
<?xml version="1.0" encoding="UTF-8"?> 
<web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" 
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee 
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"> 
<filter> 
<filter-name>struts2</filter-name> 
<filter-class> 
org.apache.struts2.dispatcher.FilterDispatcher 
</filter-class> 
</filter> 
<filter-mapping> 
<filter-name>struts2</filter-name> 
<url-pattern>/*</url-pattern> 
</filter-mapping> 
<welcome-file-list> 
<welcome-file>index.jsp</welcome-file> 
</welcome-file-list> 
</web-app>

3、struts.xml 

<!DOCTYPE struts PUBLIC 
     "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN" 
     "http://struts.apache.org/dtds/struts-2.0.dtd"> 
<struts> 
<package name="user" extends="struts-default"> 
<action name="login" class="org.ext.service.loginAction"> 
<result name="success">jsondate.jsp</result> 
</action> 
</package> 
</struts>

4、login.jsp 
<%@ page language="java" pageEncoding="gbk"%> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
<head> 
<title>wayfoon</title> 
<meta http-equiv="pragma" content="no-cache"> 
<meta http-equiv="cache-control" content="no-cache"> 
<meta http-equiv="expires" content="0"> 
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> 
<link rel="stylesheet" type="text/css" href="./ext/css/ext-all.css"> 
<script type="text/javascript" src="./ext/js/ext-base.js"></script> 
<script type="text/javascript" src="./ext/js/ext-all.js"></script> 
<script type="text/javascript" src="./ext/js/ext-lang-zh_CN.js"></script> 
<style type="text/css"> 
.user { 
background: url(./images/user.gif) no-repeat 1px 2px; 
} 

.key { 
background: url(images/key.gif) no-repeat 1px 2px; 
} 

.key,.user { 
background-color: #FFFFFF; 
padding-left: 20px; 
font-weight: bold; 
color: #000033; 
} 
</style> 
<script type="text/javascript"> 
Ext.onReady(function() { 
//        
Ext.QuickTips.init(); 
//             
Ext.form.Field.prototype.msgTarget = 'side'; 
var win = new Ext.Window({ 
id : 'login-win', 
title : '  ', 
iconCls : 'tabs', 
width : 300, 
height : 120, 
collapsible : true, 
plain : true, 
//         
items : new Ext.form.FormPanel({ 
id : 'login-form', 
labelWidth : 50, //         
labelAlign : 'right', 
buttonAlign : 'center', 
//      ，       ，             
baseCls : 'header', 
layout : 'form', 
defaults : { 
width : 200 
}, 
//        
defaultType : 'textfield', 
items : [{ 
name: 'username', 
cls: 'user', 
fieldLabel : '  ', 
allowBlank : false, 
blankText:'      '//       
//      
}, { 
name : 'password', 
inputType : 'password', 
fieldLabel : '  ', 
cls:'key', 
allowBlank : false, 
blankText:'      ' 
}], 
//       
buttons : [{ 
text : '  ', 
type : 'submit', 
handler : function() { 
var but = this; 
                    but.setDisabled(true); 
                    this.setText('    '); 
    Ext.getCmp('login-form').getForm().submit({ 
waitMsg : '      ', 
url : 'login.action', 
method : 'POST', 
success : function(form, action) { 
Ext.Msg.alert('  ','  '); 
but.setDisabled(false); 
}, 
failure : function() { 
Ext.Msg.alert('  ','  '); 
but.setText("  "); 
but.setDisabled(false); 
} 
}); 
} 
},{ 
               text: '  ', 
              handler:function(){Ext.getCmp('login-form').getForm().reset();}//     
            }] 
}) 
}); 
//         
win.show(); 
}); 
</script> 
</head> 
<body> 
</body> 
</html>

4.1 html、js分離モード
Login.jspソース
<%@ page language="java" pageEncoding="gbk"%> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
<head> 
<title>wayfoon</title> 
<meta http-equiv="pragma" content="no-cache"> 
<meta http-equiv="cache-control" content="no-cache"> 
<meta http-equiv="expires" content="0"> 
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> 
<link rel="stylesheet" type="text/css" href="./ext/css/ext-all.css"> 
<script type="text/javascript" src="./ext/js/ext-base.js"></script> 
<script type="text/javascript" src="./ext/js/ext-all.js"></script> 
<script type="text/javascript" src="./ext/js/ext-lang-zh_CN.js"></script> 
<script type="text/javascript" src="./js/login.js"></script> 
<style type="text/css"> 
.user { 
background: url(./images/user.gif) no-repeat 1px 2px; 
} 
.key { 
background: url(images/key.gif) no-repeat 1px 2px; 
} 
.key,.user { 
background-color: #FFFFFF; 
padding-left: 20px; 
font-weight: bold; 
color: #000033; 
} 
</style> 
</head> 
<body> 
</body> 
</html>

Login.jsソース

Ext.onReady(function() { 
//        
Ext.QuickTips.init(); 
//             
Ext.form.Field.prototype.msgTarget = 'side'; 
var win = new Ext.Window({ 
id : 'login-win', 
title : '  ', 
iconCls : 'tabs', 
width : 300, 
height : 120, 
collapsible : true, 
plain : true, 
//         
items : new Ext.form.FormPanel({ 
id : 'login-form', 
labelWidth : 50, //         
labelAlign : 'right', 
buttonAlign : 'center', 
//      ，       ，             
baseCls : 'header', 
layout : 'form', 
defaults : { 
width : 200 
}, 
//        
defaultType : 'textfield', 
items : [{ 
name: 'username', 
cls: 'user', 
fieldLabel : '  ', 
allowBlank : false, 
blankText:'      '//       
//      
}, { 
name : 'password', 
inputType : 'password', 
fieldLabel : '  ', 
cls:'key', 
allowBlank : false, 
blankText:'      ' 
}], 
//       
buttons : [{ 
text : '  ', 
type : 'submit', 
handler : function() { 
var but = this; 
                    but.setDisabled(true); 
                    this.setText('    '); 
    Ext.getCmp('login-form').getForm().submit({ 
waitMsg : '      ', 
url : 'login.action', 
method : 'POST', 
success : function(form, action) { 
Ext.Msg.alert('  ','  '); 
window.location.href ='main.jsp'; 
but.setDisabled(false); 
}, 
failure : function() { 
Ext.Msg.alert('  ','  '); 
but.setText("  "); 
but.setDisabled(false); 
} 
}); 
} 
},{ 
               text: '  ', 
               handler:function(){Ext.getCmp('login-form').getForm().reset();}//     
            }] 
}) 
}); 
//         
win.show(); 
});

5、jsondate.jsp 
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> 
  <%@ taglib prefix="s" uri="/struts-tags" %> 
<s:property value="jsondate" escape="false"/>

6、loginAction.java 
package org.ext.service; 
public class loginAction { 
  private String username; 
  private String password; 
  private String jsondate=""; 
public String getUsername() { 
return username; 
} 
public String getJsondate() { 
return jsondate; 
} 
public void setJsondate(String jsondate) { 
this.jsondate = jsondate; 
} 
public void setUsername(String username) { 
this.username = username; 
} 
public String getPassword() { 
return password; 
} 
public void setPassword(String password) { 
this.password = password; 
} 
public String execute() throws Exception 
{ 
if(username.equals("zjw") && password.equals("1234")) 
{ 
this.jsondate="{success:true}"; 
} 
else { 
this.jsondate="{failure : true}"; 
} 
return "success"; 
} 
}
Javaインプリメンテーション:文字列に重複しない最初の文字を見つけます.
Cassandra 1.2.xでdatastax java driverを使用した起動エラーの一例