Ext FormPanel和Struts2实现登陆界面
今天弄了一天，一直在弄Ext中的FormPanel和Struts2的整合
练习的内容是想用Ext的FormPanel来做一个登陆界面，验证用户合法性。使用FormPanel自己的submit来提交用户信息并验证，可是按照网上几乎没有较全的例子，这也只能怪自己Ext Ajax的基础太差，很多东西都不了解。最后东拼西凑总算弄明白了如何才能正确的执行FormPanel的submit的回调函数。submit提交后，必须从后台接收Json数据并且Json数据要满足一定格式：有一个success属性，值必须是true 或者 false凭借这个字段来判断提交成功或失败从而调用success回调函数或者failure回调函数；另一个是result属性，里面包含了自己需要传到前台来的数据，可以直接访问
好，说到这里，对于如何提交并接收服务端返回的数据已经有所了解。此时问题来了，这个练习采用的是Struts2来接收请求，要返回Json数据的例子以前还真没有碰到过，Google了半天总算明白了，Ext和Struts2之间的这种请求与返回需要一个jsonPlugin的插件支持，才能返回json数据。
不多废话，直接贴代码，自己做个经验教训也希望能够帮助到和我一样的新手
?
js端我采用Ext.Window嵌套FormPanel的做法
?
var fp;Ext.onReady( function() { Ext.QuickTips.init(); function checkOK(form, action) { window.location.href = action.result.result; } function checkError(form, action) { Ext.Msg.show({ title: '错误', msg: action.result.result, buttons: Ext.Msg.OK, icon: Ext.MessageBox.ERROR }); } fp = new Ext.form.FormPanel( { bodyStyle: 'padding: 15px 40px 15px 40px; background-color: #efefff;', labelAlign: 'right', labelWidth: 80, items: [ { fieldLabel: '用户名', xtype: 'textfield', width: 200, id: 'userId', name: 'userId', allowBlank: false, blankText: '请输入用户名' }, { fieldLabel: '密码', xtype: 'textfield', width: 200, id: 'password', name: 'password', inputType: 'password', allowBlank: false, blankText: '请输入密码' } ] }); var w = new Ext.Window({ title: 'Welcome', iconCls: 'i-script', closable: false, resizable: false, modal: true, shadow: true, layout: 'fit', width: 400, height: 150, border: false, plain: true, items: [fp], buttonAlign: 'center', buttons: [{text: '登陆',type: 'submit',handler: function () {var f = fp.getForm();if (f.isValid()) {f.submit({url: 'login.action',method: 'POST',waitMsg: '用户信息验证中...请稍后...',success: checkOK,failure: checkError,scope: this});} else {if (!checkInput("userId")) {Ext.Msg.show({ title: '错误', msg: '请输入用户名', buttons: Ext.Msg.OK, icon: Ext.MessageBox.ERROR });} else if (!checkInput("password")) {Ext.Msg.show({ title: '错误', msg: '请输入密码', buttons: Ext.Msg.OK, icon: Ext.MessageBox.ERROR });}}}}] }); w.show();});?
struts的配置文件中需要有几点需要注意，对于这个，网上倒是说的比较清楚
1、需要继承json-default
<package name="ZZCMIS" namespace="/" extends="json-default">
2、声明编码方式utf-8，因为json传输数据需要用utf-8编码方式
<constant name="struts.i18n.encoding" value="UTF-8"/>
3、Ext中FormPanel提交的action请求的配置，使用了jsonPlugin才可以定义json的返回类型，并且可以定义一些参数，例如includeProperties表明json只返回以下的属性，其余定义在action中的属性并不作为json数据返回客户端；相应的excludeProperties表明除了以下的属性，其余定义在action中的属性都作为json数据返回客户端；另外还有类似root等参数可以配置，具体可以参照 http://cwiki.apache.org/WW/json-plugin.html
在我的例子中，我只需要返回success的boolean型变量和result字符串即可
<action name="login" method="execute"><result type="json"> <param name="includeProperties">success,result</param></result></action>
4、后台action中具体的业务逻辑并不重要，只要把你想返回的字段设置正确即可，并同时提供get set方法
result = "main.action";success = true;return SUCCESS;
?
如果有错，欢迎大家拍砖，希望可以帮到有需要的朋友
?
struts中的action配置在spring中，就不贴出来
?
其实做完以后，我在想何必这么麻烦呢，本来在项目里我已经集成了dwr，完全可以不通过FormPanel自己的submit来做验证，使用dwr即可，哎~