`
objectbean
  • 浏览: 15079 次
  • 性别: Icon_minigender_1
  • 来自: 北京
最近访客 更多访客>>
社区版块
存档分类
最新评论

8.Ext.Ajax

    博客分类:
  • Ext
阅读更多

Ext.Ajax的基本用法

如下所示:

  1. var proxy = new var ds = Ext.Ajax.request({  
  2.     url: '07-01.txt',  
  3.     success: function(response) {  
  4.         Ext.Msg.alert('成功', response.responseText);  
  5.     },  
  6.     failure: function(response) {  
  7.         Ext.Msg.alert('失败', response.responseText);  
  8.     },  
  9.     params: { name: 'value' }  
  10. });  



这里调用的是Ext.Ajax的request函数,它的参数是一个JSON对象,具体如下所示。
> url参数表示将要访问的后台网址。
> success参数表示响应成功后的回调函数。

上例中我们直接从response取得返回的字符串,用Ext.Msg.alert显示出来。
> failure参数表示响应失败后的回调函数。

注意,这里的响应失败并不是指数据库操作之类的业务性失败,而是指HTTP返回404或500错误,请不要把HTTP响应错误与业务错误混淆在一起。
> params参数表示请求时发送到后台的参数,既可以使用JSON对象,也可以直接使用"name=value"形式的字符串。

Ext.Ajax直接继承自Ext.data.Connection,不同的是,它是一个单例,不需要用new创建实例,可以直接使用。
在使用Ext.data.Connection前需要先创建实例,因为Ext.data.Connection是为了给Ext.data中的各种proxy提供Ajax功能,分配不同的实例更有利于分别管理。
Ext.Ajax为用户提供了一个简易的调用接口,实际使用时,可以根据自己的需要进行选择。


Ext.lib.Ajax是更底层的封装

其实Ext.Ajax和Ext.data.Connection的内部功能实现都是依靠Ext.lib.Ajax来完成的,在Ext.lib.Ajax下面就是各种底层库的Ajax了。
如果使用Ext.lib.Ajax实现以上的功能,就需要写成下面的形式,如下面的代码所示:

  1. Ext.lib.Ajax.request(  
  2.     'POST',  
  3.     '07-01txt',  
  4.     {success: function(response){  
  5.         Ext.Msg.alert('成功', response.responseText);  
  6.     },failure: function(){  
  7.         Ext.Msg.alert('失败', response.responseText);  
  8.     }},  
  9.     'data=' + encodeURIComponent(Ext.encode({name:'value'}))  
  10. );  



我们可以看到,使用Ext.lib.Ajax时需要传递4个参数,分别为method、url、callback和params。
它们的含义与Ext.Ajax中的参数都是一一对应的,唯一没有提到过的method参数表示请求HTTP的方法,它也可以在Ext.Ajax中使用method:'POST'的方式设置。
相对于Ext.Ajax来说,Ext.lib.Ajax有如下几个缺点:
> 参数的顺序被定死了,第一个参数是method,第二个参数是url,第三个参数是回调函数callback,第四个参数是params。
      这样既不容易记忆,也无法省略其中某个不需要的参数。Ext.Ajax中用JSON对象来定义参数,使用起来更灵活。
> 在params部分,Ext.lib.Ajax必须使用字符串形式,显得有些笨重。Ext.Ajax则可以在JSON对象和字符串之间随意选择,非常灵活。

比与Ext.Ajax相比,Ext.lib.Ajax的唯一优势就是它可以在EXT 1.x中使用。
如果你使用的是EXT 2.0或更高的版本,那么就放心大胆地使用Ext.Ajax吧,它会带给你更多的惊喜。

分享到:
评论

相关推荐

    Ext.Ajax.request跨域

    标题"Ext.Ajax.request跨域"指出我们将探讨如何使用ExtJS库中的Ajax模块进行跨域请求。Ext.Ajax.request是ExtJS提供的一种发起Ajax请求的方式,它允许开发者向服务器发送异步HTTP请求。然而,由于浏览器的同源策略...

    Ext.Ajax.request2.x实现同步请求

    在EXTJS库中,`Ext.Ajax.request`是用于发送Ajax请求的核心方法,它支持异步和同步操作。本文将详细解析如何利用`Ext.Ajax.request`实现同步请求,并探讨其背后的原理和注意事项。 首先,我们需要理解Ajax的本质,...

    Ext.Ajax.request 小问题收集

    这篇文章将深入探讨`Ext.Ajax.request`的使用,以及在实际应用中可能遇到的小问题。 首先,`Ext.Ajax.request`的基本语法如下: ```javascript Ext.Ajax.request({ url: 'your-url', method: 'GET', // 可选值有...

    ext-basex.js 进行Ext.Ajax.request 同步请求 FF无法正常

    标题提到的"ext-basex.js进行Ext.Ajax.request同步请求 FF无法正常"问题,涉及到浏览器兼容性和异步/同步请求的理解。 `Ext.Ajax.request`是ExtJS中的一个方法,用于发起Ajax(异步JavaScript和XML)请求。它可以...

    Coolite.Ext.net.dll

    《酷力.Coolite.Ext.net.dll:快速构建富AJAX启用的ASP.NET应用程序》 在ASP.NET开发领域,酷力(Coolite)提供了一款强大的工具——Coolite.Ext.Net.dll,它是一个专为快速构建富AJAX(Asynchronous JavaScript ...

    ExtJs的Ext.Ajax.request实现waitMsg等待提示效果

    ExtJs提供了Ext.Ajax.request方法来进行Ajax请求,但默认情况下,该方法不支持waitMsg属性,不像fp.form.submit方法提供了waitTitle和waitMsg属性来实现等待提示。为了解决这一限制,我们可以采用Ext.MessageBox的...

    Ext3.2的Ext.data.Store类和Ext.Ajax类的实际运用

    其中,我们可以看到Ext.Ajax可以实现动态与静态的方式提交到web服务器。从中可以看出,其实Ext框架可以非常方便的与现有网站集成。关于Ext.data.Store类,我们可以看出:该框架提供了客户端缓存的功能--这对于我们...

    Ext ajax 上传文件

    Ext.Ajax.request({ url: 'upload.php', // 文件上传的服务器端处理程序 method: 'POST', useXhrUpload: true, headers: { 'Content-Type': undefined }, // 必须取消Content-Type以让浏览器自动设置 params: ...

    Apress.Pro.Ajax.and.Java.Frameworks.Jul.2006.HAPPY.NEW.YEAR.rar

    《Apress.Pro.Ajax.and.Java.Frameworks.Jul.2006.HAPPY.NEW.YEAR》这本书专注于探讨如何在Java环境中利用Ajax技术构建高效、交互性强的Web应用。Ajax(Asynchronous JavaScript and XML)是一种用于创建动态网页的...

    jquery.ext.zip

    jQuery,作为一个广泛使用的JavaScript库,极大地简化了DOM操作、事件处理和Ajax交互。"jquery.ext.zip"这个文件名暗示了一个基于jQuery的扩展库,它可能包含了对jQuery核心功能的增强或添加了一些特定的功能。接...

    Ext Ajax:如何调用Ext.Ajax.request方法和使用Java Servlet进行处理.doc

    Ext Ajax:如何调用Ext.Ajax.request方法和使用Java Servlet进行处理

    Ext中Ajax的应用

    Ext.Ajax.request 方法是 ExtJS 框架中用于执行 Ajax 请求的核心功能之一,它允许开发者轻松地向服务器发起异步请求并处理响应结果。此方法提供了非常丰富的配置选项,能够满足大多数情况下对于 Ajax 通信的需求。 ...

    Ext.FormPanel 提交和 Ext.Ajax.request 异步提交函数的区别

    (1)Ext.FormPanel f.getForm().submit({ url:”... }, failure:function(c,v,e){} }) (2)Ext.Ajax.request Ext.Ajax.request({ url:”….”, params:{XX:xx….}, success: function (v,c) { var json=Ext.decode(v.r

    Packtpub.Ext.JS.3.0.Cookbook.Oct.2009

    8. **测试和调试**:讲解如何对Ext JS应用进行单元测试和性能测试,以及如何利用调试工具进行问题排查。 9. **应用部署**:讨论如何将Ext JS应用部署到生产环境,包括文件结构、压缩优化和安全注意事项。 通过深入...

    Jquery+ext

    **jQuery与EXT:Web开发的强大组合** jQuery是一个轻量级的JavaScript库,它极大地简化了JavaScript的DOM操作、事件处理、动画设计以及Ajax交互。EXT则是一个基于jQuery的富客户端框架,提供了高度可定制的组件和...

    Ext2.0.2的Ajax请求拦截示例

    然而,如果我们需要为整个应用的Ajax请求设置统一的拦截器,可以使用`Ext.Ajax.on`方法来监听`beforerequest`和`requestcomplete`事件: ```javascript Ext.Ajax.on('beforerequest', function(connection, options...

    ext3.jar ext使用非常多

    例如,对AJAX请求进行了优化,增强了数据存储和模型的处理能力,同时扩展了布局选项,使得开发者能更灵活地设计用户界面。EXT3.0还加强了对不同浏览器的兼容性,使得应用程序能在多种浏览器环境下稳定运行。 EXT3....

    Ext3.1 Ajax 精简包以及使用方法

    3. **发送数据:** 在`Ext.Ajax.request`中,可以通过`params`字段传递数据,或者使用`jsonData`、`xmlData`等字段直接传入JSON或XML格式的数据。 4. **处理响应:** 成功或失败的回调函数接收两个参数,分别是响应...

Global site tag (gtag.js) - Google Analytics