ExtJS Ext.Ajax.request与form1.getForm().submit的基本区别

相同点:都属于Ajax提交方式!

不同点:Ext.Ajax.request是Ext.data.connection的一个实例

              form1.getForm().submit是BasicForm的一个实现方式

使用上的区别:

1.form1.getForm().submit常用在表单提交的时候,就是说要提交页面数据,比如新增和修改数据页面

2.Ext.Ajax.request常用在根据参数提交的时候,比如删除,我们把页面选中的ID进行遍历,封装在一个Array中,作为一个参数做Ajax的提交

例子:

首先是form1.getForm().submit的例子:

function formSubmit(){
   if (form1.getForm().isValid()) {
    form1.getForm().submit({
     waitTitle : '提示',//标题
     waitMsg : '正在提交数据请稍后...',//提示信息
     url : 'eidtBooktype.action',
     method : 'post',
     params : 'booktype',
     success : function(form, action) {
      var flag=action.result.msg;
      window.returnValue='SUCC'; 
      Ext.Msg.alert('提示',flag,function(){
       window.close();
      });
     },
     failure : function(form,action) {
      var flag=action.result.msg;
      Ext.Msg.alert('操作', flag);
     }
    });
   }
}

其次是一个Ext.Ajax.request的例子:

Ext.Ajax.request({
         url : 'deleteBooktypes.action',
        method : 'post',
        params : {delids:deleteids.toString()},
        success : function(form,action) {
         //alert(response.responseText); //返回的json值的字符串
         var respText = Ext.util.JSON.decode(form.responseText); //吧字符串变为json格式
         var msg=respText.msg;
         Ext.MessageBox.alert('提示',msg,function(){
          bookTypeStore.reload();
         });
        },
        failure : function(response,options) {
         var respText = Ext.util.JSON.decode(response.responseText); //吧字符串变为json格式
         var msg=respText.msg;
         Ext.MessageBox.alert('提示',msg,function(){
          bookTypeStore.reload();
         });
        }
       });

使用是的区别:

最明显就是success和failure时候function的参数!

Ext.Ajax.request的function(response,options),option非常有用,用response.responseText获得返回参数,注意这个地方的response参数可以换成action

form1.getForm().submit的function(form, action),action很有用,用action.result.msg获得返回值

还有个最明显区别是Ext.Ajax.request不可以用waitMsg,真是Ext的一个败笔呀!!!

 

==============================================================================================

前置: 
后台成功返回字符串:{success:true,msg:'操作成功!'} 
后台失败返回字符串:{success:false,errors:'操作失败!'} 
当submi提交时,action不存在后台返回下图字符串: 


下面所有的action不存在,是指url路径不存在 

FormPanel 提交代码如下:

Java代码  复制代码
  1. var G = new Ext.form.FormPanel({})   
  2.     
  3. G.getForm().submit({//客户端的数据提交给服务器   
  4.                     url:wayfoon.MMS.DataPage +'/ext2Upload.action',      
  5.                     //waitMsg:"正在提交表单数据,请稍候。。。。。。",       
  6.                     failure:function(form, action){   
  7.                         Ext.MessageBox.alert('警告', action.result.errors);          
  8.                     },         
  9.                     success: function(form, action){    
  10.                         Ext.MessageBox.alert('信息', action.result.msg);   
  11.                      }        
  12.                 });   
[java]  view plain copy
  1. var G = new Ext.form.FormPanel({})  
  2.    
  3. G.getForm().submit({//客户端的数据提交给服务器  
  4.                     url:wayfoon.MMS.DataPage +'/ext2Upload.action',     
  5.                     //waitMsg:"正在提交表单数据,请稍候。。。。。。",      
  6.                     failure:function(form, action){  
  7.                         Ext.MessageBox.alert('警告', action.result.errors);         
  8.                     },        
  9.                     success: function(form, action){   
  10.                         Ext.MessageBox.alert('信息', action.result.msg);  
  11.                      }       
  12.                 });   

根据后台json 字符串 success的值(ture/false)自动选择failure或者success,也可以捕捉前台错误(走failure流程),比如数据非法而被强制提交时, 
后台字符串需要通过action.result 转成json 字符串,供我们按习惯的方法使用, 

对于后台异常处理,比如 action不存在,则无能为力,会出JavaScript错误, 
错误处,ext-all.js的代码

Java代码  复制代码
  1. this.decode = function(json) {   
  2.         //alert(json);   
  3.   return eval("(" + json + ")")   
  4.  }  
[java]  view plain copy
  1. this.decode = function(json) {  
  2.         //alert(json);  
  3.   return eval("(" + json + ")")  
  4.  }  

原因是无法将上图(如图)的字符串转成json字符串,导致无法判断走哪个流程,而正常情况下,返回的是 {success:true,msg:'操作成功!'}或其他。 
试了将上面代码使用try{}catch (){} 还是不能解决JavaScript错误,我们一般可以避免这种后台错误,如果非得解决的话,不知道有没有好的解决方法。 


Ext.Ajax.request提交代码如下:

Java代码  复制代码
  1. Ext.Ajax.request({   
  2.     url:wayfoon.MMS.DataPage+'/cpSMS.action?action=submitSMS',   
  3.     method:'POST',   
  4.     params:'id='+id,   
  5.     success:function(form,action){   
  6.         var obj = Ext.util.JSON.decode(form.responseText);   
  7.         if(obj.success==true)   
  8.         {    
  9.             Ext.Msg.alert('提示',obj.msg);   
  10.             ds.reload();   
  11.         }   
  12.         else  
  13.         {   
  14.             //Ext.Msg.alert('提示',obj.errors);   
  15.             Ext.Msg.alert('提示',obj.msg);   
  16.         }     
  17.     },   
  18.     failure:function(form,action){   
  19.         Ext.Msg.alert('警告','系统错误');   
  20.     }   
  21. });  
[java]  view plain copy
  1. Ext.Ajax.request({  
  2.     url:wayfoon.MMS.DataPage+'/cpSMS.action?action=submitSMS',  
  3.     method:'POST',  
  4.     params:'id='+id,  
  5.     success:function(form,action){  
  6.         var obj = Ext.util.JSON.decode(form.responseText);  
  7.         if(obj.success==true)  
  8.         {   
  9.             Ext.Msg.alert('提示',obj.msg);  
  10.             ds.reload();  
  11.         }  
  12.         else  
  13.         {  
  14.             //Ext.Msg.alert('提示',obj.errors);  
  15.             Ext.Msg.alert('提示',obj.msg);  
  16.         }    
  17.     },  
  18.     failure:function(form,action){  
  19.         Ext.Msg.alert('警告','系统错误');  
  20.     }  
  21. });  

后台字符串通过Ext.util.JSON.decode 转成json字符串 
不能自动根据json字符串success的值来选择流程 ,需要根据obj.success的值来判断走哪个流程 

该failure:可以捕捉系统异常,比如,数据未曾提交到后台或action 不存在,此时走failure 流程

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值