`

Ext FormPanel submit 提交与Ext.Ajax.request提交的区别 深究

阅读更多
前置:
后台成功返回字符串:{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 提交和 Ext.Ajax.request 异步提交函数的区别

    总结,`Ext.FormPanel`的`getForm().submit()`更适合处理基于表单的数据提交,它简化了表单数据的处理和验证,而`Ext.Ajax.request`则提供了更高的灵活性,适用于各种HTTP请求,特别是当需要发送非表单数据或处理...

    EXT提交服务器的三种方式

    3. **EXT的Ajax请求**:EXT提供了`Ext.Ajax.request`方法,这是一个独立于表单的AJAX请求方式,适用于不涉及表单的情况。这个方法可以直接向服务器发送GET或POST请求,传递参数,处理响应。例如,代码中展示了如何...

    ExtJs4.0 表单提交Demo

    Ext.Ajax是ExtJs中的一个核心类,负责处理异步的Ajax请求。通过它,开发者可以轻松地向服务器发送GET、POST等HTTP请求,接收响应数据,并处理相应的回调函数。在表单提交场景下,Ext Ajax提供了方便的API进行数据的...

    ext几个实例

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

    Ext.NET.WebForms.Pro.2.5.1.Examples.Explorer

    Ext.NET 是一个强大的JavaScript库,专门用于构建富客户端Web应用程序,尤其在ASP.NET环境中。它提供了丰富的用户界面组件,能够创建具有桌面应用级别的交互性和视觉效果的网页应用。标题"Ext.NET.WebForms.Pro....

    EXT.form组件

    1. `form`:`Ext.FormPanel`是EXT JS中的表单面板,它是一个容器,可以容纳各种表单字段和其他组件。表单面板允许你定义布局、提交行为以及处理表单数据的方法。 2. `checkbox`:`Ext.form.Checkbox`是用于创建复选...

    EXT异步提交FORM表单

    此时可以通过`Ext.Ajax.request`方法来实现更为灵活的控制。 ```javascript Ext.Ajax.request({ url: 'yourActionUrl', params: form.getForm().getFieldValues(), callback: function(options, success, ...

    ext-3-TextField-sample.rar_ext_ext TextField_ext textfield inp

    在表单中,每个TextField作为表单的一个字段,可以通过`FormPanel`的`getForm().load()`和`submit()`方法进行数据加载和提交。 6. **示例代码**: 压缩包内的"sample"文件可能包含了创建和使用TextField的示例代码...

    Ext.NET.MVC.Pro.2.2.0.MVC.Examples.Explorer.zip

    示例涵盖了各种Ext.NET MVC控件的用法,如表格(GridPanel)、窗体(FormPanel)、树形视图(TreePanel)、图表(Charts)、菜单(Menu)、工具提示(ToolTip)等。通过这些示例,开发者可以快速学习如何配置和...

    Ext 添加功能form表单实例

    在这个例子中,通过`new Ext.FormPanel`来创建了一个表单面板,并设置了一些关键属性: - `frame`: 设置为`true`,表示表单周围有一个边框。 - `width` 和 `height`: 分别设置了表单的宽度和高度。 - `layout`: ...

    Ext组件描述,各个组件含义

    ### Ext组件概述与详解 #### 一、Ext基础组件 **1.1 Box Component (Ext.BoxComponent)** - **xtype**: `box` - **功能描述**:Box Component 是一个非常基本的 Ext 组件,主要用于定义具有边框和其他布局属性的...

    Ext 动态加载表单数据

    7. **Ajax请求**:使用`Ext.Ajax.request`方法发送异步请求到服务器获取JSON数据。在响应回调中,解析JSON并更新表单内容。 以下是一个基本的示例代码片段,展示了如何动态加载JSON数据到表单: ```javascript // ...

    ExtJs 动态添加表单

    var formPanel = Ext.create('Ext.form.Panel', { layout: 'form', items: [] }); ``` 2. **定义表单字段**: 根据需求,我们可以定义各种类型的字段。例如,添加一个文本字段: ```javascript var ...

    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 ...

    ext判断该用户是否在数据库中存在

    在上面的代码中,我们可以看到使用了 Ext.Ajax.request 方法来发送 AJAX 请求,检测用户名是否已经存在于数据库中。在服务器端,可以使用数据库查询来检测用户名是否已经存在于数据库中。如果用户名已经存在,则返回...

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

    在这种情况下,`Ext.Ajax.request`方法用于发送请求,`params`对象包含了要发送的数据,`success`函数处理成功的回调。 总结: EXT JS提供了灵活的表单数据提交方式,包括默认的AJAX提交、非AJAX提交以及使用Ajax类...

    ext.net 1.x DEMO

    FormPanel 则用于创建和更新数据,它可以与后台数据库进行数据交换,通过 Form 的 Submit 或 Load 方法实现数据的保存和读取。 **Drag 功能** EXT.NET 1.x 提供了拖放(Drag & Drop)功能,允许用户通过鼠标操作将...

Global site tag (gtag.js) - Google Analytics