extjs 9 EXT的form表单ajax提交（默认提交方式）

最新推荐文章于 2021-08-05 22:16:09 发布

六毛饭

最新推荐文章于 2021-08-05 22:16:09 发布

阅读量677

点赞数

CC 4.0 BY-SA版权

分类专栏： extjs

本文链接：https://blog.youkuaiyun.com/cruelchen/article/details/9307697

extjs 专栏收录该内容

55 篇文章

订阅专栏

本文详细介绍了使用EXT框架进行表单提交的多种方法，包括默认的Ajax提交、非Ajax提交及直接通过Ext.Ajax进行数据提交的过程。每种提交方式都提供了具体的代码示例，并解释了如何处理成功和失败的情况。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1, EXT的form表单ajax提交（默认提交方式）

[复制到剪贴板]CODE:
1. function login(item) {
2.
3.            if (validatorForm()) {
4.                // 登录时将登录按钮设为disabled，防止重复提交
5.                this.disabled = true;
6.
7.                // 第一个参数可以为submit和load
8.                formPanl.form.doAction('submit', {
9.
10.                    url : 'user.do?method=login',
11.
12.                    method : 'post',
13.
14.                    // 如果有表单以外的其它参数，可以加在这里。我这里暂时为空，也可以将下面这句省略
15.                        params : '',
16.
17.                        // 第一个参数是传入该表单，第二个是Ext.form.Action对象用来取得服务器端传过来的json数据
18.                        success : function(form, action) {
19.
20.                            Ext.Msg.alert('操作', action.result.data);
21.                            this.disabled = false;
22.
23.                        },
24.                        failure : function(form, action) {
25.
26.                            Ext.Msg.alert('警告', '用户名或密码错误！');
27.                            // 登录失败，将提交按钮重新设为可操作
28.                            this.disabled = false;
29.
30.                        }
31.                    });
32.                this.disabled = false;
33.            }
34.        }

2.EXT表单的非ajax提交

[复制到剪贴板]CODE:
1. //实现非AJAX提交表单一定要加下面的两行！ onSubmit : Ext.emptyFn, submit : function() {
2. //再次设定action的地址
3. this.getEl().dom.action ='user.do?method=login'; this.getEl().dom.method = 'post';
4. //提交submit
5. this.getEl().dom.submit();
6. },

3.EXT的ajax提交

[复制到剪贴板]CODE:
1.
2.
3. Ext.Ajax.request({
4.                                        //请求地址
5.                      url: 'login.do',
6.                      //提交参数组
7.                      params: {
8.                          LoginName:Ext.get('LoginName').dom.value,
9.                          LoginPassword:Ext.get('LoginPassword').dom.value
10.                      },
11.                      //成功时回调
12.                      success: function(response, options) {
13.                        //获取响应的json字符串
14.                        var responseArray = Ext.util.JSON.decode(response.responseText);
15.                            if(responseArray.success==true){
16.                                Ext.Msg.alert('恭喜','您已成功登录！');
17.                            }
18.                            else{
19.                                Ext.Msg.alert('失败','登录失败，请重新登录');
20.                            }
21.                    }
22.            });