`
huiseyiyu
  • 浏览: 101350 次
  • 性别: Icon_minigender_1
  • 来自: 苏州
社区版块
存档分类
最新评论

Ext.Ajax.request 与formPanel.getForm().submit() success的区别(转)

 
阅读更多

formPanel提交方式

Ext.MessageBox.wait('正在提数据, 请稍侯 ...', '提示');
xxxxFormPanel.getForm().submit({
	timeout : 60,
	success : function(form, action) {
        // 业务成功
		Ext.MessageBox.updateProgress(1);
		Ext.MessageBox.hide();

	},
	failure : function(form, action) {
        // 业务失败
		Ext.MessageBox.updateProgress(1);
		Ext.MessageBox.hide();

		switch (action.failureType) {
			case Ext.form.Action.CLIENT_INVALID :
				Ext.Msg.alert('错误!', '存在未通过验证的数据!');
				break;
			case Ext.form.Action.CONNECT_FAILURE :
				Ext.Msg.alert('错误!', '连接错误!');
				break;
			case Ext.form.Action.SERVER_INVALID :
				Ext.Msg.alert('错误!', action.result.msg);
		}
	}
});

 

Ajax提交方式

	Ext.Ajax.request({
		url : ...,
		params : {
			...
		},
		success : function(response, opts) {
			var o = Ext.util.JSON.decode(response.responseText);
			if( o.success){
				// 业务执行成功
			} else{
				// 业务执行失败
			}
		},
		failure : function(response, opts) {
			// ? 此处怎么做,大家可以说说  :oops: 
		}
	});

 

 

另一种写法:

Extjs Ext.data.store 捕获加载数据的异常,并打印信息

new Ext.data.Store({
	proxy : new Ext.data.HttpProxy({
		url : basePath + '/fundAuditAction.do'
	}),
	reader : new Ext.data.JsonReader({
		totalProperty : 'total',
		root : 'root',
		successProperty : 'succeed',
		fields : [...]
	})
    ,successProperty: 'success' // 后台传输的标识。必须
	,listeners:{
		exception:function(dataProxy, type, action, options, response, arg) { 
			var o = Ext.util.JSON.decode(response.responseText);
			if(!o.success){
				Ext.Msg.alert('错误提示',o.message);
			}
        }
	}
});

 

二者都可以接收服务器端返回的如下json串:

{success:true/false,msg:'xxxx'}

 

 

 

如果success为true,对于formPanel提交方式,程序会进入success回调函数;对于Ajax提交方式,程序也会进入success回调函数。
而区别在于如果success为false,对于formPanel提交方式,程序会进入failure回调函数;而Ajax提交方式,程序依然会进入success回调函数。

总结:
success的true和false可以用来表示业务的成功或者失败。
1、在formPanel提交方式中,成功后的操作要在success回调函数中进行,失败后的操作在failure回调函数中进行;
2、在Ajax提交方式中,业务的成功失败都应该在success回调函数中进行操作,而true或者false以o.success获得(具体见代码及注释)。

 

 

 

Ext.Ajax.request 中success failure:

success参数表示响应成功后的回调函数。

failure参数表示响应失败后的回调函数。

注意,这里的响应失败并不是指数据库操作之类的业务性失败,而是指HTTP返回404或500错误,请不要把HTTP响应错误与业务错误混淆在一起。

 

 

好的做法:

在框架中加入异常的捕获(比如:拦截器),对异常进行在封装和定位,不同的异常代码表示不同的错误信息,对于EXT的异常提示会有很好的帮助 。

 

 

 

 

分享到:
评论

相关推荐

    Ext.FormPanel 提交和 Ext.Ajax.request 异步提交函数的区别

    (1)Ext.FormPanel f.getForm().submit({ url:”……”, params:{ XX:xx …..} success: function (c,v,e) { //e: 触发事件 var json=Ext.decode(v.response.responseText); }, failure:function(c,v,e){} }) (2)Ext....

    Ext的FormPanel组件

    Ext的FormPanel组件说明formPanel的详细使用说明

    ext几个实例

    本篇是关于Ext.Ajax + Ext.FormPanel + MySQL数据库的完整登录案例,一个是html的form表单,一个是Ext的FormPanel表单,在提交或结合Ext.Ajax多少还是有区别的.

    .archExtJs2.0学习系列(7)--Ext.FormPanel之第四式(其他组件示例篇).doc

    .archExtJs2.0学习系列(7)--Ext.FormPanel之第四式(其他组件示例篇).doc

    Extjs优化(二)Form表单提交通用实现

    a.formPanel.getForm().submit({ scope: b, url: a.url, method: “post”, params: a.params, waitMsg: “正在提交数据…”, success: function(c, d) { Ext.ux.Toast.msg(“操作信息”, “成功信息保存!...

    Ext+JS高级程序设计.rar

    1.2 Ext Core的Ajax功能 19 1.3 DomQuery详解 20 1.4 模板介绍 23 1.5 实用功能 24 1.6 定时执行代码 25 1.7 本章小结 26 第2章 Ext Core实例系统设计 27 2.1 需求分析 27 2.2 系统设计 28 2.3 功能结构图 29 2.4 ...

    ExtJs入门实例

    4. ExtJs2.0学习系列(4)--Ext.FormPanel之第一式 5. ExtJs2.0学习系列(5)--Ext.FormPanel之第二式 6. ExtJs2.0学习系列(6)--Ext.FormPanel之第三式(ComboBox篇) 7. ExtJs2.0学习系列(7)--Ext.FormPanel之第四式(其他...

    ExtJs实现数据加载和提交经典代码

    FormPanel中的 form对象为Ext.form.BasicForm类型的对象,它有load和submit方法分别用于加载数据和提交数据。而这两个方法都是通过调用 Ext.form.BasicForm中的doAction方法来操作的。doAction方法带有两个参数,...

    ExtAspNet_v2.3.2_dll

    ExtAspNet - ExtJS based ASP.NET Controls with Full AJAX Support ExtAspNet是一组专业的Asp.net控件库,拥有原生的AJAX支持和丰富的UI效果, 目标是创建没有ViewState,没有JavaScript,没有CSS,没有...

    ext-2.3.0+CKEditor 3.0.1+ckfinder_asp_1.4配置详解及工程源码

    var tab2 = new Ext.FormPanel({ labelAlign: 'top', title: 'Inner Tabs', bodyStyle:'padding:5px', width: 1000, items: [{ layout:'column', border:false, items:[{ columnWidth:.5, layout: 'form'...

    extjs form textfield的隐藏方法

    this.formpanel = new Ext.FormPanel({ items: [{ fieldLabel: ‘代码’, name: ‘FCode’, anchor:’100%’, id: ‘fid’ },{ fieldLabel: ‘名称’, name: ‘FName’, anchor:’100%’ // anchor width by ...

    轻松搞定Extjs_原创

    二、Ext.Ajax类 65 三、Ajax文件上传 67 四、你来自远方 72 五、小结 73 第十二章:分页与ComboBox 74 一、关于分页 74 二、从Servlet获取当前页数据 74 三、创建ComboBox 76 四、小结 77 第十三章:面板(Panel) ...

    深入浅出ExtJS第2版

    深入浅出ExtJS第2版+源码..1 下载EXT发布包 1 1.2 如何查看EXT自带的API和示例 1 1.3 为什么有些示例必须放在服务器上 才能看到效果 2 1.4 Hello World 2 1.4.1 直接使用下载的发布包 2 1.4.2 在项目中使用EXT...

    Ext table布局实例 formpanel的table布局

    Ext table布局实例 formpanel的table布局

    ExtJs4.0 表单提交Demo

    一个简单的ExtJs4.0搭建环境,利用Ext Ajax的方式提交表单,可使得显示层和控制层完全分开.

    Ext 表单布局实例代码

    代码如下:Ext.onReady(function(){ Ext.QuickTips.init(); //第一句的目的是为需要的元件提供提示信息功能,form的主要提示信息就是客户端验证的错误信息了。 Ext.form.Field.prototype.msgTarget = ‘under’; //第...

    Extjs中DisplayField的日期或者数字格式化扩展

    使用 Ext.form.FormPanel 来处理数据时候,某些字段是需要只读的。当然我们可以使用 Ext.form.TextField,然后设置成 ReadOnly,不过这样子的显示效果不是很好,因为始终会有个输入框。所以我们必须使用 Ext.form....

    sencha的ajax+formpanel+google地图

    sencha的ajax+formpanel+google地图

Global site tag (gtag.js) - Google Analytics