`
acdf111
  • 浏览: 23770 次
  • 性别: Icon_minigender_1
  • 来自: 成都
社区版块
存档分类
最新评论

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

    博客分类:
  • EXT
阅读更多
前置:
后台成功返回字符串:{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提交服务器的三种方式

    1. **EXT的Form表单AJAX提交**:这是EXT中最常见的提交方式,它允许你在不刷新整个页面的情况下与服务器进行异步通信。通过使用`doAction`方法,你可以方便地触发表单的提交,并指定URL、HTTP方法以及额外的参数。...

    ext几个实例

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

    EXT异步提交FORM表单

    EXT异步提交FORM表单的核心是通过Ajax技术实现表单数据的后台提交,而无需刷新整个页面。这种方式的主要优点在于能够提供更加流畅的用户交互体验,同时减少了服务器端的负载压力。 ##### 2.2 实现步骤 1. **初始化...

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

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

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

    3. **使用Ext FormPanel的Ajax提交** 第三种方式是创建一个Ext FormPanel,然后在用户交互后提交表单。在`saveUser_ajaxSubmit3`函数中,首先定义了一个包含用户名和密码字段的表单面板,然后在“确定”按钮的点击...

    ext开发_前后台交互

    #### Ext.Ajax.request与form.submit的区别 尽管这两种方法都能实现前后端的数据交换,但它们之间存在一些关键差异。`form.submit()`根据后端返回的JSON数据的`success`字段自动选择成功或失败的回调,同时能处理...

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

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

    extjs文档的详细介绍

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

    EXT3.0 JSP上传

    EXT3.0提供了Ajax请求的方法,如`Ext.Ajax.request`,我们可以利用它向服务器发送POST请求,携带文件数据。同时,需要在服务器端(JSP)配置接收并处理这些上传文件的逻辑。例如: ```javascript Ext.onReady...

    sencha的ajax+formpanel+google地图

    在“sencha的ajax+formpanel+google地图”这个主题中,我们将深入探讨如何使用Sencha Touch与Ajax、FormPanel以及Google Maps API集成,来创建一个具有数据提交和地图展示功能的应用。 首先,`app.html`是应用的...

    ext多文件上传

    当用户选择好文件后,我们通常会使用AJAX异步提交这些文件。EXTJS的`Ext.Ajax.request`方法可以用于发送HTTP请求。在上传过程中,我们需要使用`FormData`对象来封装文件数据,并将其附加到请求中。示例代码如下: `...

    extjs四种异步提交

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

    ext精典例子(增删改查)

    1. **创建(Create)**:使用EXT的FormPanel组件收集用户输入,然后通过Ajax请求将数据提交到服务器端保存。例如,创建一个新的记录时,我们可以通过监听表单的submit事件,获取表单数据,并使用Ajax发送POST请求。 ...

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

    在上传图片的场景中,EXT的FileField组件可以用于选择本地文件,FormPanel可以封装整个上传表单,而Ajax提交方式可以实现异步上传,无需页面刷新。 3. **上传图片的流程**: - 用户在EXT前端选择图片文件,EXT的...

    Extjs upload(ext官网例子)

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

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

    总结来说,这个EXT登录示例展示了EXT如何创建前端用户界面,以及如何与Java Servlet配合完成数据提交和后端处理。EXT的灵活性和Java Servlet的稳定性相结合,为开发健壮的Web应用提供了基础。对于初学者来说,理解...

    ext分页查询ext分页查询ext分页查询ext分页查询ext分页查询

    4. **Ajax请求**:在示例代码中,使用`Ext.Ajax.request`或者`FormPanel`的`submit`方法发送异步请求到服务器。在请求参数中,除了查询条件,还需要提供分页信息。成功响应后,数据通常以JSON格式返回,然后解析并...

    ext用到的增删改查

    例如,`submitForm`函数可能会监听表单的提交事件,收集表单数据,然后使用`Ext.Ajax.request`或`Ext.form.action.Submit`进行异步提交到服务器。在服务器端,如Java环境下,你需要处理这些请求,解析接收到的数据,...

Global site tag (gtag.js) - Google Analytics