`
huiseyiyu
  • 浏览: 102460 次
  • 性别: 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....

    extjs文档的详细介绍

    本文将详细介绍EXTJS中两种主要的前后台数据传递方法:`Ext.Ajax.request` 和 `FormPanel` 的 `getForm().submit()`。 首先,`Ext.Ajax.request` 是EXTJS提供的一个全局Ajax对象,用于发送异步HTTP请求。它的基本...

    ext几个实例

    【EXTJS】Ext.AJAX与FormPanel在登录案例中的应用 EXTJS是一个强大的JavaScript库,主要用于构建富客户端Web应用程序。在EXTJS中,Ext.AJAX和Ext.FormPanel是两个核心组件,它们分别用于异步与服务器进行数据交互和...

    ext开发_前后台交互

    通过创建一个`FormPanel`实例,并调用`getForm().submit()`方法,可以轻松实现数据的发送与接收。此方法支持设置请求URL、参数、请求类型(如POST或GET)、成功及失败回调函数等。此外,它还能自动显示一个进度条,...

    ext 的ppt ext 的ppt ext 的pptext 的pptext 的ppt

    此外,还可以使用`Ext.lib.Ajax.request`进行异步提交,方法与上述submit类似,只是更底层,可以直接控制请求参数和回调函数。 总之,Ext Form是Ext JS中的强大组件,提供了丰富的功能来创建、验证和提交表单数据。...

    EXT3.0 JSP上传

    uploadForm.getForm().on('submit', function(form, event) { event.preventDefault(); var fileInput = Ext.getCmp('fileInput'); var formData = form.getFieldValues(); formData.file = fileInput....

    EXT异步提交FORM表单

    form.getForm().submit({ success: function(form, action) { console.log('表单提交成功:', action.result); }, failure: function(form, action) { console.error('表单提交失败:', action.result); } });...

    extJS中常用的4种Ajax异步提交方式

    1. **直接使用Ext.Ajax.request方法** 这是最基础的Ajax提交方式,适用于手动封装请求参数的情况。在`saveUser_ajaxSubmit1`函数中,我们看到直接调用了`Ext.Ajax.request`方法,指定了URL、HTTP方法(POST)以及要...

    ext多文件上传

    formPanel.getForm().submit({ url: 'upload.php', // 服务器端处理文件的URL method: 'POST', enctype: 'multipart/form-data', params: {action: 'upload'}, // 添加额外参数 success: function(form, action...

    Extjs upload(ext官网例子)

    可以使用`Ext.Ajax.request`或`Ext.form.action.Submit`,设置`method`为`POST`,并使用`params`或`formParams`指定其他非文件数据。 ```javascript var form = this.getForm(); if (form.isValid()) { form....

    ext form 表单提交数据的方法小结

    本文主要总结了EXT表单提交数据的三种常见方法:EXT的form表单AJAX提交、非AJAX提交以及EXT的Ajax类直接提交。 1. EXT的form表单AJAX提交(默认提交方式) EXT的form表单默认采用AJAX方式进行数据提交,这样可以在...

    Extjs结合Asp.net文件上传

    form.getForm().submit({ url: 'Upload.ashx', // ASP.NET 处理文件的URL method: 'POST', success: function(form, action) { alert('文件上传成功'); }, failure: function(form, action) { alert('文件...

    asp.net+ext上传图片并显示

    form.getForm().submit({ url: '/Upload.ashx', // ASP.NET处理路径 success: function(form, action) { // 显示图片 } }); } }] }); ``` 以上就是使用ASP.NET和EXT库实现上传图片并显示的核心知识点,...

    Extjs多文件上传

    formPanel.getForm().submit({ url: 'upload.php', // 服务器端接收文件的URL method: 'POST', useDefaultXhrHeader: false, success: function(form, action) { // 处理成功响应 }, failure: function(form,...

    extjs四种异步提交

    在`saveUser_ajaxSubmit1`函数中,EXT JS提供了`Ext.Ajax.request`方法进行异步提交。你需要手动构建要传递的参数,并设置URL、请求方法(如POST或GET)。在`success`和`failure`回调函数中处理服务器响应。 2. **...

    Ext一个登陆的小例子 (java+servlet)

    var form = Ext.getCmp('loginForm').getForm(); if (form.isValid()) { form.submit({ url: 'LoginServlet', method: 'POST', success: function(form, action) { // 登录成功处理 }, failure: function...

    extjs 上传图片(可以上传其他类型的文件)asp 实现

    formPanel.getForm().submit({ url: 'upload.asp', // ASP处理文件上传的URL method: 'POST', enctype: 'multipart/form-data', success: function(form, action) { alert('文件已成功上传'); }, failure: ...

Global site tag (gtag.js) - Google Analytics