extjs私の2番目のextプログラム:フォーム

6444 ワード

apache Json Ajax struts ext

構想
簡単なフォームプログラムを作って、ユーザーがログインします.
ターゲット、ユーザーの情報の送信に成功しました.
struts 2部はjsonプラグインを採用しています.struts 2を採用する.18のバージョンではjsonプラグインを追加ダウンロードする必要はありません.strus2.18持参しました
struts.xml


<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
    "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
    "http://struts.apache.org/dtds/struts-2.0.dtd">

<struts>

    <constant name="struts.enable.DynamicMethodInvocation" value="true" />
    <constant name="struts.devMode" value="false" />
    <constant name="struts.convention.result.path" value="/contents/"/>
    <constant name="struts.custom.i18n.resources" value="messageResource" />

        <!-- 
    <package name="default" namespace="/" extends="convention-default">
        <default-action-ref name="index" />
        <action name="index">
            <result type="redirectAction">
                <param name="actionName">HelloWorld</param>
                <param name="namespace">/example</param>
            </result>
        </action>
        
    </package> -->

    <!-- Add packages here -->
    <package name="json" namespace="/" extends="json-default">
		<action name="login" class="cn.ibeans.demo.web.action.LoginAction">
			<result type="json"/>
		</action>
		<!-- 
		<action name="message_*"
			class="cn.ibeans.web.action.MessageAction"
			method="{1}"> 
		</action>-->
	</package>
</struts>


<html>
  <head>
    <title>Login</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<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">
	<meta http-equiv="description" content="This is my page">
<link rel="stylesheet" type="text/css" href="scripts/ext/resources/css/ext-all.css" />
<script type="text/javascript" src="scripts/ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="scripts/ext/ext-all.js"></script>
<script type="text/javascript" src="contents/js/login.js"></script>
  </head>
  
<body>
<div id="loginpanel"></div>
</body>
</html>


var login = function(){
	Ext.QuickTips.init();
	Ext.lib.Ajax.defaultPostHeader += ";charset=utf-8";
	Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
	//        
	var form = new Ext.form.FormPanel({
		//title:'   ',
		defaultType:'textfield',
		region:'center',
		labelAlign:'right',
		url:'login!login.action',
		items:[{
			fieldLabel:'  ',
			name:'username'
		},{
			inputType:'password',
			fieldLabel:'  ',
			name:'password'
		}],
		buttons:[{
			text : '  ',
			handler : function() {
				form.getForm().submit( {
					//url : 'login!login.action',
					waitMsg : '    ，   ...',
					success : function(form, action){
						Ext.MessageBox.alert("info",action.result.username);
						// window.location.href = a.result.url;
					}
				});
			}
		}, {
			text : '  ',
			handler : function() {
				form.getForm().reset();
			}
		}]
	});

	var panel = new Ext.Panel( {
		renderTo : 'loginpanel',
		layout : "border",
		width : 525,
		height : 290,
		defaults : {
			border : false
		},
		items : [ {
			region : "north",
			height : 56,
			html : 'north..................................'
		}, {
			region : "south",
			height : 56,
			html : 'south..................................'
		}, {
			region : "west",
			width : 253,
			html : 'west'
		},form]
	});

	Ext.get('loginpanel').setStyle('position', 'absolute').center(Ext.getBody());

};

Ext.onReady(login);

ここから少し通じなかったのはbutton提出後のsuccess:function(form,action){...}
バックグラウンドは処理に成功したが、ここでは何も実行できない.勉強を続ける中...
やっと分かった:actionにbooleanタイプのsuccessという属性がなければならない.
LoginAction.java:


public class LoginAction extends ActionSupport {
	private static Logger log= Logger.getLogger(LoginAction.class);
	private String username;
	private String password;
	private boolean success;
	
	
	public String getUsername() {
		return username;
	}


	public void setUsername(String username) {
		this.username = username;
	}


	public boolean isSuccess() {
		return success;
	}


	public void setSuccess(boolean success) {
		this.success = success;
	}


	public String getPassword() {
		return password;
	}


	public void setPassword(String password) {
		this.password = password;
	}


	public String login(){
		this.setSuccess(true);
		log.info("login method is called."+username+":"+password);
		return super.SUCCESS;
	}
	
}

LeetCode | Reverse Words in a String

RMQ問題のSparse_Tableアルゴリズム