`
gkuiyj
  • 浏览: 91006 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

extJs 2.1学习笔记(Ext.Updater篇二)

阅读更多
全  称:Ext.Updater
命名空间:Ext
定义 于:UpdateManager.js
类  名:Updater
父  类:Observable

为Element对象提供Ajax式的更新能力。Updater能用于更新Element一次或者使用startAutoRefresh让Element具备定时更新的能力。

用法:

//从一个Ext.Element对象获得Updater的引用
var el = Ext.get("foo");
var mgr = el.getUpdater();
mgr.update({
url: "http://myserver.com/index.php",
params: {
  param1: "foo",
  param2: "bar"
}
});
...
mgr.formUpdate("myFormId", "http://myserver.com/index.php");


//或者直接通过Updater构造函数来创建
var mgr = new Ext.Updater("myElementId");
mgr.startAutoRefresh(60, "http://myserver.com/index.php");
mgr.on("update", myFcnNeedsToKnow);

   //从element对象的简捷调用方式
   Ext.get("foo").load({
        url: "bar.php",
        scripts: true,
        params: "param1=foo&param2=bar",
        text: "Loading Foo..."
   });


总结上一面共计有四种更新方法:
updater.update({……});
updater.formUpdate(formname,url);
updater.startAutoRefresh(second,url);
Element.load({……});

公共属性:

defaultUrl : String
保存updater上一次更新时使用的url。

disableCaching : Boolean
是否在url后面上一个唯一标志的参数(当前时间,见Ext.data.Connection),默认值为:Ext.Updater.defaults.disableCaching.


el : Ext.Element
updater使用的element。

formUpdateDelegate : Function
相当于dotnet中的delegate。在别的地方定义,到这儿来调用。回调啦。内部使用方法如下:myUpdater.formUpdateDelegate.createCallback(arg1, arg2)

indicatorText : String
指示器文本(正在加载的时候),默认值为:Ext.Updater.defaults.indicatorText。

loadScripts : Boolean
输出的时候是不是加过脚本(?),默认值为:Ext.Updater.defaults.loadScripts。

refreshDelegate : Function
用于refresh()内的委托,scope使用this。内部使用方法如下:myUpdater.refreshDelegate.createCallback(arg1, arg2)。

renderer : Object
Updater的呈现器(默认值为:Ext.Updater.BasicRenderer)

showLoadIndicator : String
是否在加载过程中显示指示器文本,默认值为:Ext.Updater.defaults.showLoadIndicator。文档有误,应当是boolean类型。


sslBlankUrl : String
空页面url,用于SSL文件上传。默认值为:Ext.Updater.defaults.sslBlankUrl。

timeout : Number
请求超时。单位是秒。默认值为:Ext.Updater.defaults.timeout。

transaction : Object
当前事务对象,如果没有当前事务则为null。

updateDelegate : Function
用于更新(update())的委托。内部使用方式为:myUpdater.updateDelegate.createCallback(arg1, arg2)

公共方法:

Updater( Mixed el, [Boolean forceNew] )
直接创建一个新的Updater对象。


Updater.updateElement( Mixed el, String url, [String/Object params], [Object options] ) : void

不赞成. 一个静态方法. 反对用此函数取代el.load({url:'foo.php', ...})

用法:Ext.Updater.updateElement("my-div", "stuff.php");

abort() : void
取消当前正在执行的事务。

formUpdate( String/HTMLElement form, [String url], [Boolean reset], [Function callback] ) : void

执行一个异步form post。用返回的响应数据更新element。如果form有一个属性:enctype="multipart/form-data",它表示这是上传文件,将使用this.sslBlankUrl来阻止IE安全警告。

 参数:
   form : String/HTMLElement
   form的id或者是element。

   url : String
   用于form.action。即提交的网址。

   reset : Boolean
   是否在更新完后重置表单。

   callback : Function
   当事务完毕后执和,它有如下参数:

      el : Ext.Element
      正在执行更新的元素

      success : Boolean
      是否更新成功。

      response : XMLHttpRequest
      响应结果。。

getEl() : Ext.Element
获得要更新的元素。


getRenderer() : void
取得当前内容呈现器。到Ext.Updater.BasicRenderer.render看更多的细节。

isAutoRefreshing() : void
是否是定时更新。。

isUpdating() : Boolean
是否处于正在更新中。

refresh( [Function callback] ) : void
用上一次更新的地址(defaultUrl)再次更新一下。如果没有就马上返回。
  callback : Function  
  更新完毕后调用。

setDefaultUrl( String/Function defaultUrl ) : void
设置defaultUrl。

setRenderer( Object renderer ) : void
设置呈现器。

showLoading() : void
显示指示器。

startAutoRefresh( Number interval, [String/Object/Function url], [String/Object params], [Function callback], [Boolean refreshNow] ) : void
把这个元素设置为自动更新。通过使用stopAutoRefresh来停止自动更新。

stopAutoRefresh() : void
停止自动更新。

update( Object options ) : void

发起一次异步请求,使用请求的响应结果来更新元素内容。

注意:由于异步请求的一般是远程主机,所以元素不会在此函数返回时更新。要处理返回的数据,请使用回调或事件。

  参数:
    options : Object
    一个包含如下属性的配置对象。
    
     url : String/Function
     请求所需要的url或能返回url的函数。

     method : String
     Post或者是GET。全为大写。

     params : String/Object/Function
     见Ext.data.Connection中的options.params的说明。

     scripts : Boolean
     当响应数据中包含<script>……</script>,即包含脚本或脚本引用时,是否提取并执行。为真则执行。默认值为:Ext.Updater.defaults.loadScripts。如果这个属性在options中设置了,那么回调将在此script执行完后再执行。

     callback : Function
     当响应结果已返回时调用,它有如下参数:
       el : Ext.Element
       正在更新的元素的引用。

       success : Boolean
       是否更新成功。

       response : XMLHttpRequest
       包含响应数据的XMLHttpRequest。

       options : Object
       传给update方法的options。

     scope : Object
     回调使用的scope。

     discardUrl : Boolean
     是否抛弃当前更新的url,不保存到defaultUrls。

     timeout : Number
          超时设置,单位为秒。默认值为:Ext.Updater.defaults.timeout。

     text : String
     这个text与indicatorText的区别在于,请见代码:
     this.indicatorText = '<div class="loading-indicator">'+cfg.text+"</div>";

     nocache : Boolean
     用于Ext.data.Connection.disableCaching。
  

     示例代码:
     um.update({
         url: "your-url.php",
         params: {param1: "foo", param2: "bar"}, // or a URL encoded string
         callback: yourFunction,
         scope: yourObject, //(optional scope)
         discardUrl: true,
         nocache: true,
         text: "Loading...",
         timeout: 60,
         scripts: false // Save time by avoiding RegExp execution.
     });


公共事件:

beforeupdate : ( Ext.Element el, String/Object/Function url, String/Object params )
在更新之前触发。。

failure : ( Ext.Element el, Object oResponseObject )
更新失败时触发。


update : ( Ext.Element el, Object oResponseObject )
更新成功时触发。
分享到:
评论

相关推荐

    extJs 2.1学习笔记

    21. extJs 2.0学习笔记(Ext.Panel篇二) 50 22. extJs 2.0学习笔记(Ext.Panel篇三) 59 23. extJs 2.0学习笔记(Ext.Panel篇四) 62 24. extJs 2.0学习笔记(组件总论篇) 66 25. extJs 2.0学习笔记(Ext.Element API总结) ...

    extJs+2.1学习笔记.pdf

    15. **extJs 2.0 学习笔记(Ext.Panel终结篇)** Panel是构建UI的基本组件,涵盖了布局、标题、工具栏等多种功能。掌握Panel的使用和配置,能创建复杂而灵活的界面。 16. **extJs 2.0 学习笔记(事件注册总结篇)*...

    extjs-Ext.ux.form.LovCombo下拉框

    在EXTJS框架中,`Ext.ux.form.LovCombo`是一种自定义组件,它扩展了基本的`Ext.form.field.ComboBox`,提供了更丰富的功能,尤其是针对多选和联动选择的需求。这个组件通常用于创建具有“lov”(即“Look Up Value”...

    extjs中Ext.Panel和TreePanel 组件动态加载本地页面数据

    在EXTJS这个强大的JavaScript框架中,`Ext.Panel`和`TreePanel`是两个非常重要的组件,它们被广泛用于构建复杂的用户界面。这篇文章将探讨如何在这些组件中动态加载本地页面数据,以提升用户体验并实现灵活的数据...

    Extjs4.0学习笔记大全.pdf

    Extjs4.0学习笔记大全.pdf,供大家学习

    ExtJS 3.4.0中的 ext.jsb2 文件

    在3.4.0版本中,`ext.jsb2` 文件是一个关键组成部分,它对于理解和开发基于ExtJS的应用程序至关重要。这个文件的缺失可能会对升级到4.0.0版本的开发者造成困扰,因为4.0.0版本不再包含这个文件,但幸运的是,它可以...

    extjs2.1库文件

    ExtJS 2.1 库文件是Web应用程序开发的一个重要工具,主要用于构建富客户端界面。这个版本的ExtJS提供了一套完整的组件模型、布局管理、数据绑定和事件处理机制,帮助开发者快速创建交互性强、用户体验良好的网页应用...

    ExtJS ToolTip功能

    ### ExtJS ToolTip功能 #### 知识点详解 在ExtJS中,`ToolTip`功能是一种非常实用且灵活的功能,它允许用户在鼠标悬停在某个元素上时显示额外的信息。这种特性对于提高用户界面的可用性和用户体验尤其有用。本文将...

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

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

    2828-Extjs4.0学习笔记大全.pdf

    ExtJS4 学习笔记(一)---window 的创建 Extjs4,创建 Ext 组件有了新的方式,就是 Ext.create(....),而且可以使用动态加载 JS 的方式 来加快组件的渲染,我们再也不必一次加载已经达到 1MB 的 ext-all.js 了,本文...

    Ext2.1中文文档

    EXTJS 2.1中文文档提供了对EXTJS这一JavaScript库的详细解读,是开发者学习和理解EXTJS的重要参考资料。EXTJS是一种用于构建富客户端Web应用的框架,它以组件化和可扩展性著称,提供了丰富的用户界面组件,如表格、...

    extjs2.1 开发包

    EXTJS 2.1 是一个历史悠久但依然备受推崇的JavaScript框架,主要用于构建富客户端Web应用程序。这个开发包因其强大的功能和灵活性,使得开发者能够创建出与Windows操作系统界面类似的交互式用户体验。EXTJS的核心...

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

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

    Extjs4.X下comboboxTree下拉树型菜单,完美支持多选、单选,绝对好用

    在ExtJS 4.x框架中,ComboboxTree是一种特殊的组件,它将传统的下拉框与树形结构结合在一起,提供了一种更为灵活的用户输入方式。这种组件在数据选择上非常实用,尤其当数据层级关系复杂时,可以方便地进行多选或...

    Extjs2.1源码%2B教程.rar

    标题中的“Extjs2.1源码%2B教程.rar”指的是包含ExtJS 2.1版本的源代码以及相关教程的压缩文件,这对于开发者来说是一个宝贵的资源,尤其是对于那些想要深入理解ExtJS工作原理或者学习如何使用这个框架的人来说。...

    Ext.ux.UploadDialog.zip

    开发者可以通过EXT的API文档学习如何配置和使用UploadDialog,包括添加按钮、监听事件、设置参数等。对于初次接触EXTjs UploadDialog的开发者来说,理解EXT的组件体系结构、事件模型和配置选项是非常重要的。 通过...

    ExtJS 4.0 改善Ext.grid.plugin.RowEditing (重构,v1.4版本,2011-09-11)

    这篇文章的标题指出这是一个关于“Ext.grid.plugin.RowEditing”的重构,版本为v1.4,发布日期为2011年9月11日。重构通常意味着代码的改进,可能涉及性能优化、错误修复或功能增强。在4.0版本中,RowEditing插件的...

    ExtJs选中var editor = new Ext.ux.grid.RowEditor详解

    ### ExtJs选中 `var editor = new Ext.ux.grid.RowEditor` 详解 在Web开发领域,特别是使用ExtJs框架进行复杂用户界面构建时,`RowEditor` 是一个非常实用的功能,它允许用户直接在表格行内编辑数据,极大地提高了...

    extjs4的Ext.frorm.Panel控件属性说明和表单控件说明

    主要用例子说明extjs4的form表单的运用,其中有表单属性说明,表单控件运用说明如: title:'表单', //表单标题 bodyStyle:'padding:5 5 5 5', //表单边距 height:120, //表单高度 width:200, //表单宽度 ...

Global site tag (gtag.js) - Google Analytics