Hierarchy
Ext.util.ObservableExt.Updater
Files
UpdateManager.js

Provides AJAX-style update capabilities for Element objects. Updater can be used to update\nan Ext.Element once, or you can use startAutoRefresh to set up an auto-updating\nElement on a specific interval.

\nUsage:

\n\n

var el = Ext.get(\"foo\"); // Get Ext.Element object\nvar mgr = el.getUpdater();\nmgr.update({\n        url: \"http://myserver.com/index.php\",\n        params: {\n            param1: \"foo\",\n            param2: \"bar\"\n        }\n});\n...\nmgr.formUpdate(\"myFormId\", \"http://myserver.com/index.php\");\n
\n// or directly (returns the same Updater instance)\nvar mgr = new Ext.Updater(\"myElementId\");\nmgr.startAutoRefresh(60, \"http://myserver.com/index.php\");\nmgr.on(\"update\", myFcnNeedsToKnow);\n
\n// short handed call directly from the element object\nExt.get(\"foo\").load({\n        url: \"bar.php\",\n        scripts: true,\n        params: \"param1=foo&param2=bar\",\n        text: \"Loading Foo...\"\n});\n

\n\n

Defined By

Config options

Ext.util.Observable
view source

listeners : Object

(optional) A config object containing one or more event handlers to be added to this\nobject during initialization. ...

(optional)

A config object containing one or more event handlers to be added to this\nobject during initialization. This should be a valid listeners config object as specified in the\naddListener example for attaching multiple handlers at once.

\n\n

DOM events from ExtJs Components

\n\n\n

While some ExtJs Component classes export selected DOM events (e.g. \"click\", \"mouseover\" etc), this\n\n\n

is usually only done when extra value can be added. For example the DataView's\nclick event passing the node clicked on. To access DOM\nevents directly from a Component's HTMLElement, listeners must be added to the Element after the Component\nhas been rendered. A plugin can simplify this step:

\n\n

// Plugin is configured with a listeners config object.\n// The Component is appended to the argument list of all handler functions.\nExt.DomObserver = Ext.extend(Object, {\n    constructor: function(config) {\n        this.listeners = config.listeners ? config.listeners : config;\n    },\n\n    // Component passes itself into plugin's init method\n    init: function(c) {\n        var p, l = this.listeners;\n        for (p in l) {\n            if (Ext.isFunction(l[p])) {\n                l[p] = this.createHandler(l[p], c);\n            } else {\n                l[p].fn = this.createHandler(l[p].fn, c);\n            }\n        }\n\n        // Add the listeners to the Element immediately following the render call\n        c.render = c.render.createSequence(function() {\n            var e = c.getEl();\n            if (e) {\n                e.on(l);\n            }\n        });\n    },\n\n    createHandler: function(fn, c) {\n        return function(e) {\n            fn.call(this, e, c);\n        };\n    }\n});\n\nvar combo = new Ext.form.ComboBox({\n\n    // Collapse combo when its element is clicked on\n    plugins: [ new Ext.DomObserver({\n        click: function(evt, comp) {\n            comp.collapse();\n        }\n    })],\n    store: myStore,\n    typeAhead: true,\n    mode: 'local',\n    triggerAction: 'all'\n});\n

\n\n\n

Defined By

Properties

Ext.Updater
view source

defaultUrl : String

Cached url to use for refreshes. ...

Cached url to use for refreshes. Overwritten every time update() is called unless \"discardUrl\" param is set to true.

Ext.Updater
view source

disableCaching : Boolean

Whether to append unique parameter on get request to disable caching (defaults to Ext.Updater.defaults.disableCaching).

Ext.Updater
view source

el : Ext.Element

The Element object

Ext.Updater
view source

formUpdateDelegate : Function

Delegate for formUpdate() prebound to \"this\", use myUpdater.formUpdateDelegate.createCallback(arg1, arg2) to bind arg...

Delegate for formUpdate() prebound to \"this\", use myUpdater.formUpdateDelegate.createCallback(arg1, arg2) to bind arguments

Ext.Updater
view source

indicatorText : String

Text for loading indicator (defaults to Ext.Updater.defaults.indicatorText).

Ext.Updater
view source

loadScripts : Boolean

True to process scripts in the output (defaults to Ext.Updater.defaults.loadScripts).

Ext.Updater
view source

refreshDelegate : Function

Delegate for refresh() prebound to \"this\", use myUpdater.refreshDelegate.createCallback(arg1, arg2) to bind arguments

Ext.Updater
view source

renderer : Object

The renderer for this Updater (defaults to Ext.Updater.BasicRenderer).

Ext.Updater
view source

showLoadIndicator : String

Whether to show indicatorText when loading (defaults to Ext.Updater.defaults.showLoadIndicator).

Ext.Updater
view source

sslBlankUrl : String

Blank page URL to use with SSL file uploads (defaults to Ext.Updater.defaults.sslBlankUrl).

Ext.Updater
view source

timeout : Number

Timeout for requests or form posts in seconds (defaults to Ext.Updater.defaults.timeout).

Ext.Updater
view source

transaction : Object

Transaction object of the current executing transaction, or null if there is no active transaction.

Ext.Updater
view source

updateDelegate : Function

Delegate for update() prebound to \"this\", use myUpdater.updateDelegate.createCallback(arg1, arg2) to bind arguments

Methods

Defined By

Instance Methods

Ext.Updater
view source

newExt.Updater( el, [forceNew] ) : Ext.Updater

Create new Updater directly. ...

Create new Updater directly.

Parameters

el : Mixed
The element to update
\n
forceNew : Boolean (optional)
By default the constructor checks to see if the passed element already\nhas an Updater and if it does it returns the same instance. This will skip that check (useful for extending this class).
\n

Returns

Ext.Updater
\n

Ext.Updater
view source

abort( )

Aborts the currently executing transaction, if any. ...

Aborts the currently executing transaction, if any.

Ext.util.Observable
view source

addEvents( o, Optional )

Adds the specified events to the list of events which this Observable may fire. ...

Adds the specified events to the list of events which this Observable may fire.

Parameters

o : Object|String
Either an object with event names as properties with a value of true\nor the first event name string if multiple event names are being passed as separate parameters.
\n
Optional : string
. Event name if multiple event names are being passed as separate parameters.\nUsage:
\n\n
```
this.addEvents('storeloaded', 'storecleared');\n
```
\n\n

Ext.util.Observable
view source

addListener( eventName, handler, [scope], [options] )

Appends an event handler to this object. ...

Appends an event handler to this object.

Parameters

eventName : String
The name of the event to listen for.
\n
handler : Function
The method the event invokes.
\n
scope : Object (optional)
The scope (this reference) in which the handler function is executed.\nIf omitted, defaults to the object which fired the event.
\n
options : Object (optional)
An object containing handler configuration.\nproperties. This may contain any of the following properties:
- scope : Object
  The scope (this reference) in which the handler function is executed.\nIf omitted, defaults to the object which fired the event.
- delay : Number
  The number of milliseconds to delay the invocation of the handler after the event fires.
- single : Boolean
  True to add a handler to handle just the next firing of the event, and then remove itself.
- buffer : Number
  Causes the handler to be scheduled to run in an Ext.util.DelayedTask delayed\nby the specified number of milliseconds. If the event fires again within that time, the original\nhandler is not invoked, but the new handler is scheduled in its place.
- target : Observable
  Only call the handler if the event was fired on the target Observable, not\nif the event was bubbled up from a child Observable.
\n\n
\nCombining Options
\nUsing the options argument, it is possible to combine different types of listeners:
\n
\nA delayed, one-time listener.\n
```
myDataView.on('click', this.onClick, this, {\nsingle: true,\ndelay: 100\n});
```
\n
\nAttaching multiple handlers in 1 call
\nThe method also allows for a single argument to be passed which is a config object containing properties\nwhich specify multiple handlers.\n
\n
```
myGridPanel.on({\n'click' : {\n    fn: this.onClick,\n    scope: this,\n    delay: 100\n},\n'mouseover' : {\n    fn: this.onMouseOver,\n    scope: this\n},\n'mouseout' : {\n    fn: this.onMouseOut,\n    scope: this\n}\n});
```
\n
\nOr a shorthand syntax:
\n
```
myGridPanel.on({\n'click' : this.onClick,\n'mouseover' : this.onMouseOver,\n'mouseout' : this.onMouseOut,\n scope: this\n});
```
\n\n

Ext.util.Observable
view source

enableBubble( events )

Enables events fired by this Observable to bubble up an owner hierarchy by calling\nthis.getBubbleTarget() if present. ...

Enables events fired by this Observable to bubble up an owner hierarchy by calling\nthis.getBubbleTarget() if present. There is no implementation in the Observable base class.

\n\n\n

This is commonly used by Ext.Components to bubble events to owner Containers. See Ext.Component.getBubbleTarget. The default\nimplementation in Ext.Component returns the Component's immediate owner. But if a known target is required, this can be overridden to\naccess the required target more quickly.

\n\n\n

Example:

\n\n\n

Ext.override(Ext.form.Field, {\n    //  Add functionality to Field's initComponent to enable the change event to bubble\n    initComponent : Ext.form.Field.prototype.initComponent.createSequence(function() {\n        this.enableBubble('change');\n    }),\n\n    //  We know that we want Field's events to bubble directly to the FormPanel.\n    getBubbleTarget : function() {\n        if (!this.formPanel) {\n            this.formPanel = this.findParentByType('form');\n        }\n        return this.formPanel;\n    }\n});\n\nvar myForm = new Ext.formPanel({\n    title: 'User Details',\n    items: [{\n        ...\n    }],\n    listeners: {\n        change: function() {\n            // Title goes red if form has been modified.\n            myForm.header.setStyle('color', 'red');\n        }\n    }\n});\n

\n\n

Parameters

events : String/Array
The event name to bubble, or an Array of event names.
\n

Ext.util.Observable
view source

fireEvent( eventName, args ) : Boolean

Fires the specified event with the passed parameters (minus the event name). ...

Fires the specified event with the passed parameters (minus the event name).

\n\n\n

An event may be set to bubble up an Observable parent hierarchy (See Ext.Component.getBubbleTarget)\nby calling enableBubble.

\n\n

Parameters

eventName : String
The name of the event to fire.
\n
args : Object...
Variable number of parameters are passed to handlers.
\n

Returns

Boolean
returns false if any of the handlers return false otherwise it returns true.
\n

Ext.Updater
view source

formUpdate( form, [url], [reset], [callback] )

Performs an asynchronous form post, updating this element with the response. ...

Performs an asynchronous form post, updating this element with the response. If the form has the attribute\nenctype=\"multipart/form-data\", it assumes it's a file upload.\nUses this.sslBlankUrl for SSL file uploads to prevent IE security warning.

\n\n\n

File uploads are not performed using normal \"Ajax\" techniques, that is they are not\nperformed using XMLHttpRequests. Instead the form is submitted in the standard manner with the\nDOM <form> element temporarily modified to have its\ntarget set to refer\nto a dynamically generated, hidden <iframe> which is inserted into the document\nbut removed after the return data has been gathered.

\n\n\n

Be aware that file upload packets, sent with the content type multipart/form-data\nand some server technologies (notably JEE) may require some custom processing in order to\nretrieve parameter names and parameter values from the packet content.

\n\n

Parameters

form : String/HTMLElement
The form Id or form element
\n
url : String (optional)
The url to pass the form to. If omitted the action attribute on the form will be used.
\n
reset : Boolean (optional)
Whether to try to reset the form after the update
\n
callback : Function (optional)
Callback when transaction is complete. The following\nparameters are passed:
- el : Ext.Element
  The Element being updated.
- success : Boolean
  True for success, false for failure.
- response : XMLHttpRequest
  The XMLHttpRequest which processed the update.
\n

Ext.Updater
view source

getDefaultRenderer( )

This is an overrideable method which returns a reference to a default\nrenderer class if none is specified when creati...

This is an overrideable method which returns a reference to a default\nrenderer class if none is specified when creating the Ext.Updater.\nDefaults to Ext.Updater.BasicRenderer

Ext.Updater
view source

getEl( ) : Ext.Element

Get the Element this Updater is bound to ...

Get the Element this Updater is bound to

Returns

Ext.Element
The element
\n

Ext.Updater
view source

getRenderer( ) : Object

Returns the current content renderer for this Updater. ...

Returns the current content renderer for this Updater. See Ext.Updater.BasicRenderer.render for more details.

Returns

Object
\n

Ext.util.Observable
view source

hasListener( eventName ) : Boolean

Checks to see if this object has any listeners for a specified event ...

Checks to see if this object has any listeners for a specified event

Parameters

eventName : String
The name of the event to check for
\n

Returns

Boolean
True if the event is being listened for, else false
\n

Ext.Updater
view source

isAutoRefreshing( )

Returns true if the Updater is currently set to auto refresh its content (see startAutoRefresh), otherwise false. ...

Returns true if the Updater is currently set to auto refresh its content (see startAutoRefresh), otherwise false.

Ext.Updater
view source

isUpdating( ) : Boolean

Returns true if an update is in progress, otherwise false. ...

Returns true if an update is in progress, otherwise false.

Returns

Boolean
\n

Ext.util.Observable
view source

on( eventName, handler, [scope], [options] )

Appends an event handler to this object (shorthand for addListener.) ...

Appends an event handler to this object (shorthand for addListener.)

Parameters

eventName : String
The type of event to listen for
\n
handler : Function
The method the event invokes
\n
scope : Object (optional)
The scope (this reference) in which the handler function is executed.\nIf omitted, defaults to the object which fired the event.
\n
options : Object (optional)
An object containing handler configuration.
\n

Ext.util.Observable
view source

purgeListeners( )

Removes all listeners for this object ...

Removes all listeners for this object

Ext.Updater
view source

refresh( [callback] )

Refresh the element with the last used url or defaultUrl. ...

Refresh the element with the last used url or defaultUrl. If there is no url, it returns immediately

Parameters

callback : Function (optional)
Callback when transaction is complete - called with signature (oElement, bSuccess)
\n

Ext.util.Observable
view source

relayEvents( o, events )

Relays selected events from the specified Observable as if the events were fired by this. ...

Relays selected events from the specified Observable as if the events were fired by this.

Parameters

o : Object
The Observable whose events this object is to relay.
\n
events : Array
Array of event names to relay.
\n

Ext.util.Observable
view source

removeListener( eventName, handler, [scope] )

Removes an event handler. ...

Removes an event handler.

Parameters

eventName : String
The type of event the handler was associated with.
\n
handler : Function
The handler to remove. This must be a reference to the function passed into the addListener call.
\n
scope : Object (optional)
The scope originally specified for the handler.
\n

Ext.util.Observable
view source

resumeEvents( )

Resume firing events. ...

Resume firing events. (see suspendEvents)\nIf events were suspended using the queueSuspended parameter, then all\nevents fired during event suspension will be sent to any listeners now.

Ext.Updater
view source

setDefaultUrl( defaultUrl )

Sets the default URL used for updates. ...

Sets the default URL used for updates.

Parameters

defaultUrl : String/Function
The url or a function to call to get the url
\n

Ext.Updater
view source

setRenderer( renderer )

Sets the content renderer for this Updater. ...

Sets the content renderer for this Updater. See Ext.Updater.BasicRenderer.render for more details.

Parameters

renderer : Object
The object implementing the render() method
\n

Ext.Updater
view source

showLoading( )

Display the element's \"loading\" state. ...

Display the element's \"loading\" state. By default, the element is updated with indicatorText. This\nmethod may be overridden to perform a custom action while this Updater is actively updating its contents.

Ext.Updater
view source

startAutoRefresh( interval, [url], [params], [callback], [refreshNow] )

Set this element to auto refresh. ...

Set this element to auto refresh. Can be canceled by calling stopAutoRefresh.

Parameters

interval : Number
How often to update (in seconds).
\n
url : String/Object/Function (optional)
The url for this request, a config object in the same format\nsupported by load, or a function to call to get the url (defaults to the last used url). Note that while\nthe url used in a load call can be reused by this method, other load config options will not be reused and must be\nsepcified as part of a config object passed as this paramter if needed.
\n
params : String/Object (optional)
The parameters to pass as either a url encoded string\n\"&param1=1&param2=2\" or as an object {param1: 1, param2: 2}
\n
callback : Function (optional)
Callback when transaction is complete - called with signature (oElement, bSuccess)
\n
refreshNow : Boolean (optional)
Whether to execute the refresh now, or wait the interval
\n

Ext.Updater
view source

stopAutoRefresh( )

Stop auto refresh on this element. ...

Stop auto refresh on this element.

Ext.util.Observable
view source

suspendEvents( queueSuspended )

Suspend the firing of all events. ...

Suspend the firing of all events. (see resumeEvents)

Parameters

queueSuspended : Boolean
Pass as true to queue up suspended events to be fired\nafter the resumeEvents call instead of discarding all suspended events;
\n

Ext.util.Observable
view source

un( eventName, handler, [scope] )

Removes an event handler (shorthand for removeListener.) ...

Removes an event handler (shorthand for removeListener.)

Parameters

eventName : String
The type of event the handler was associated with.
\n
handler : Function
The handler to remove. This must be a reference to the function passed into the addListener call.
\n
scope : Object (optional)
The scope originally specified for the handler.
\n

Ext.Updater
view source

update( options )

Performs an asynchronous request, updating this element with the response. ...

Performs an asynchronous request, updating this element with the response.\nIf params are specified it uses POST, otherwise it uses GET.

\nNote: Due to the asynchronous nature of remote server requests, the Element\nwill not have been fully updated when the function returns. To post-process the returned\ndata, use the callback option, or an update event handler.

Parameters

options : Object
A config object containing any of the following options:
- url : String/Function
  The URL to request or a function which\nreturns the URL (defaults to the value of Ext.Ajax.url if not specified).
- method : String
  The HTTP method to\nuse. Defaults to POST if the params argument is present, otherwise GET.
- params : String/Object/Function
  The\nparameters to pass to the server (defaults to none). These may be specified as a url-encoded\nstring, or as an object containing properties which represent parameters,\nor as a function, which returns such an object.
- scripts : Boolean
  If true\nany <script> tags embedded in the response text will be extracted\nand executed (defaults to Ext.Updater.defaults.loadScripts). If this option is specified,\nthe callback will be called after the execution of the scripts.
- callback : Function
  A function to\nbe called when the response from the server arrives. The following\nparameters are passed:
  - el : Ext.Element
    The Element being updated.
  - success : Boolean
    True for success, false for failure.
  - response : XMLHttpRequest
    The XMLHttpRequest which processed the update.
  - options : Object
    The config object passed to the update call.
  \n
- scope : Object
  The scope in which\nto execute the callback (The callback's this reference.) If the\nparams argument is a function, this scope is used for that function also.
- discardUrl : Boolean
  By default, the URL of this request becomes\nthe default URL for this Updater object, and will be subsequently used in refresh\ncalls. To bypass this behavior, pass discardUrl:true (defaults to false).
- timeout : Number
  The number of seconds to wait for a response before\ntiming out (defaults to Ext.Updater.defaults.timeout).
- text : String
  The text to use as the innerHTML of the\nExt.Updater.defaults.indicatorText div (defaults to 'Loading...'). To replace the entire div, not\njust the text, override Ext.Updater.defaults.indicatorText directly.
- nocache : Boolean
  Only needed for GET\nrequests, this option causes an extra, auto-generated parameter to be appended to the request\nto defeat caching (defaults to Ext.Updater.defaults.disableCaching).
\n\n
\nFor example:\n \n
```
    um.update({\n        url: \"your-url.php\",\n        params: {param1: \"foo\", param2: \"bar\"}, // or a URL encoded string\n        callback: yourFunction,\n        scope: yourObject, //(optional scope)\n        discardUrl: true,\n        nocache: true,\n        text: \"Loading...\",\n        timeout: 60,\n        scripts: false // Save time by avoiding RegExp execution.\n    });\n    
```
\n\n

Defined By

Static Methods

Ext.Updater
view source

updateElement( el, url, [params], [options] )deprecatedstatic

Static convenience method. ...

Static convenience method. This method is deprecated in favor of el.load({url:'foo.php', ...}).\nUsage:

\n\n

Ext.Updater.updateElement(\"my-div\", \"stuff.php\");

\n\n

This method has been deprecated

\n \n\n

Parameters

el : Mixed
The element to update
\n
url : String
The url
\n
params : String/Object (optional)
Url encoded param string or an object of name/value pairs
\n
options : Object (optional)
A config object with any of the Updater properties you want to set - for\nexample: {disableCaching:true, indicatorText: \"Loading data...\"}
\n

Defined By

Events

Ext.Updater
view source

beforeupdate( el, url, params )

Fired before an update is made, return false from your handler and the update is cancelled. ...

Fired before an update is made, return false from your handler and the update is cancelled.

Parameters

el : Ext.Element
\n
url : String/Object/Function
\n
params : String/Object
\n

Ext.Updater
view source

failure( el, oResponseObject )

Fired on update failure. ...

Fired on update failure.

Parameters

el : Ext.Element
\n
oResponseObject : Object
The response Object
\n

Ext.Updater
view source

update( el, oResponseObject )

Fired after successful update is made. ...

Fired after successful update is made.

Parameters

el : Ext.Element
\n
oResponseObject : Object
The response Object
\n