前置:
后台成功返回字符串:{success:true,msg:'操作成功!'}
后台失败返回字符串:{success:false,errors:'操作失败!'}
当submi提交时,action不存在后台返回下图字符串:
下面所有的action不存在,是指url路径不存在
FormPanel 提交代码如下:
var G = new Ext.form.FormPanel({})
G.getForm().submit({//客户端的数据提交给服务器
url:wayfoon.MMS.DataPage +'/ext2Upload.action',
//waitMsg:"正在提交表单数据,请稍候。。。。。。",
failure:function(form, action){
Ext.MessageBox.alert('警告', action.result.errors);
},
success: function(form, action){
Ext.MessageBox.alert('信息', action.result.msg);
}
});
根据后台json 字符串 success的值(ture/false)自动选择failure或者success,也可以捕捉前台错误(走failure流程),比如数据非法而被强制提交时,
后台字符串需要通过action.result 转成json 字符串,供我们按习惯的方法使用,
对于后台异常处理,比如 action不存在,则无能为力,会出JavaScript错误,
错误处,ext-all.js的代码
this.decode = function(json) {
//alert(json);
return eval("(" + json + ")")
}
原因是无法将上图(如图)的字符串转成json字符串,导致无法判断走哪个流程,而正常情况下,返回的是 {success:true,msg:'操作成功!'}或其他。
试了将上面代码使用try{}catch (){} 还是不能解决JavaScript错误,我们一般可以避免这种后台错误,如果非得解决的话,不知道有没有好的解决方法。
Ext.Ajax.request提交代码如下:
Ext.Ajax.request({
url:wayfoon.MMS.DataPage+'/cpSMS.action?action=submitSMS',
method:'POST',
params:'id='+id,
success:function(form,action){
var obj = Ext.util.JSON.decode(form.responseText);
if(obj.success==true)
{
Ext.Msg.alert('提示',obj.msg);
ds.reload();
}
else
{
//Ext.Msg.alert('提示',obj.errors);
Ext.Msg.alert('提示',obj.msg);
}
},
failure:function(form,action){
Ext.Msg.alert('警告','系统错误');
}
});
后台字符串通过Ext.util.JSON.decode 转成json字符串
不能自动根据json字符串success的值来选择流程 ,需要根据obj.success的值来判断走哪个流程
该failure:可以捕捉系统异常,比如,数据未曾提交到后台或action 不存在,此时走failure 流程
分享到:
相关推荐
总结,`Ext.FormPanel`的`getForm().submit()`更适合处理基于表单的数据提交,它简化了表单数据的处理和验证,而`Ext.Ajax.request`则提供了更高的灵活性,适用于各种HTTP请求,特别是当需要发送非表单数据或处理...
1. **EXT的Form表单AJAX提交**:这是EXT中最常见的提交方式,它允许你在不刷新整个页面的情况下与服务器进行异步通信。通过使用`doAction`方法,你可以方便地触发表单的提交,并指定URL、HTTP方法以及额外的参数。...
【EXTJS】Ext.AJAX与FormPanel在登录案例中的应用 EXTJS是一个强大的JavaScript库,主要用于构建富客户端Web应用程序。在EXTJS中,Ext.AJAX和Ext.FormPanel是两个核心组件,它们分别用于异步与服务器进行数据交互和...
EXT异步提交FORM表单的核心是通过Ajax技术实现表单数据的后台提交,而无需刷新整个页面。这种方式的主要优点在于能够提供更加流畅的用户交互体验,同时减少了服务器端的负载压力。 ##### 2.2 实现步骤 1. **初始化...
本文主要总结了EXT表单提交数据的三种常见方法:EXT的form表单AJAX提交、非AJAX提交以及EXT的Ajax类直接提交。 1. EXT的form表单AJAX提交(默认提交方式) EXT的form表单默认采用AJAX方式进行数据提交,这样可以在...
3. **使用Ext FormPanel的Ajax提交** 第三种方式是创建一个Ext FormPanel,然后在用户交互后提交表单。在`saveUser_ajaxSubmit3`函数中,首先定义了一个包含用户名和密码字段的表单面板,然后在“确定”按钮的点击...
#### Ext.Ajax.request与form.submit的区别 尽管这两种方法都能实现前后端的数据交换,但它们之间存在一些关键差异。`form.submit()`根据后端返回的JSON数据的`success`字段自动选择成功或失败的回调,同时能处理...
此外,还可以使用`Ext.lib.Ajax.request`进行异步提交,方法与上述submit类似,只是更底层,可以直接控制请求参数和回调函数。 总之,Ext Form是Ext JS中的强大组件,提供了丰富的功能来创建、验证和提交表单数据。...
本文将详细介绍EXTJS中两种主要的前后台数据传递方法:`Ext.Ajax.request` 和 `FormPanel` 的 `getForm().submit()`。 首先,`Ext.Ajax.request` 是EXTJS提供的一个全局Ajax对象,用于发送异步HTTP请求。它的基本...
EXT3.0提供了Ajax请求的方法,如`Ext.Ajax.request`,我们可以利用它向服务器发送POST请求,携带文件数据。同时,需要在服务器端(JSP)配置接收并处理这些上传文件的逻辑。例如: ```javascript Ext.onReady...
在“sencha的ajax+formpanel+google地图”这个主题中,我们将深入探讨如何使用Sencha Touch与Ajax、FormPanel以及Google Maps API集成,来创建一个具有数据提交和地图展示功能的应用。 首先,`app.html`是应用的...
当用户选择好文件后,我们通常会使用AJAX异步提交这些文件。EXTJS的`Ext.Ajax.request`方法可以用于发送HTTP请求。在上传过程中,我们需要使用`FormData`对象来封装文件数据,并将其附加到请求中。示例代码如下: `...
在`saveUser_ajaxSubmit1`函数中,EXT JS提供了`Ext.Ajax.request`方法进行异步提交。你需要手动构建要传递的参数,并设置URL、请求方法(如POST或GET)。在`success`和`failure`回调函数中处理服务器响应。 2. **...
1. **创建(Create)**:使用EXT的FormPanel组件收集用户输入,然后通过Ajax请求将数据提交到服务器端保存。例如,创建一个新的记录时,我们可以通过监听表单的submit事件,获取表单数据,并使用Ajax发送POST请求。 ...
在上传图片的场景中,EXT的FileField组件可以用于选择本地文件,FormPanel可以封装整个上传表单,而Ajax提交方式可以实现异步上传,无需页面刷新。 3. **上传图片的流程**: - 用户在EXT前端选择图片文件,EXT的...
可以使用`Ext.Ajax.request`或`Ext.form.action.Submit`,设置`method`为`POST`,并使用`params`或`formParams`指定其他非文件数据。 ```javascript var form = this.getForm(); if (form.isValid()) { form....
总结来说,这个EXT登录示例展示了EXT如何创建前端用户界面,以及如何与Java Servlet配合完成数据提交和后端处理。EXT的灵活性和Java Servlet的稳定性相结合,为开发健壮的Web应用提供了基础。对于初学者来说,理解...
4. **Ajax请求**:在示例代码中,使用`Ext.Ajax.request`或者`FormPanel`的`submit`方法发送异步请求到服务器。在请求参数中,除了查询条件,还需要提供分页信息。成功响应后,数据通常以JSON格式返回,然后解析并...
例如,`submitForm`函数可能会监听表单的提交事件,收集表单数据,然后使用`Ext.Ajax.request`或`Ext.form.action.Submit`进行异步提交到服务器。在服务器端,如Java环境下,你需要处理这些请求,解析接收到的数据,...