X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/7a654f8d43fdb43d78b63d90528bed6e86b608cc..3789b528d8dd8aad4558e38e22d775bcab1cbd36:/docs/api/Ext.ComponentLoader.html?ds=sidebyside diff --git a/docs/api/Ext.ComponentLoader.html b/docs/api/Ext.ComponentLoader.html deleted file mode 100644 index e32d02b2..00000000 --- a/docs/api/Ext.ComponentLoader.html +++ /dev/null @@ -1,504 +0,0 @@ -Ext.ComponentLoader | Ext JS 4.0 Documentation -
For up to date documentation and features, visit -http://docs.sencha.com/ext-js/4-0

Sencha Documentation

- - - - - -

Hierarchy

Ext.ElementLoader
Ext.ComponentLoader

Mixins

This class is used to load content via Ajax into a Ext.Component. In general -this class will not be instanced directly, rather a loader configuration will be passed to the -constructor of the Ext.Component.

- -

HTML Renderer

- -

By default, the content loaded will be processed as raw html. The response text -from the request is taken and added to the component. This can be used in -conjunction with the scripts option to execute any inline scripts in -the resulting content. Using this renderer has the same effect as passing the -Ext.Component.html configuration option.

- -

Data Renderer

- -

This renderer allows content to be added by using JSON data and a Ext.XTemplate. -The content received from the response is passed to the Ext.Component.update method. -This content is run through the attached Ext.Component.tpl and the data is added to -the Component. Using this renderer has the same effect as using the Ext.Component.data -configuration in conjunction with a Ext.Component.tpl.

- -

Component Renderer

- -

This renderer can only be used with a Ext.Container and subclasses. It allows for -Components to be loaded remotely into a Container. The response is expected to be a single/series of -Ext.Component configuration objects. When the response is received, the data is decoded -and then passed to Ext.Container.add. Using this renderer has the same effect as specifying -the Ext.Container.items configuration on a Container.

- -

Custom Renderer

- -

A custom function can be passed to handle any other special case, see the renderer option.

- -

Example Usage

- -
new Ext.Component({
-    tpl: '{firstName} - {lastName}',
-    loader: {
-        url: 'myPage.php',
-        renderer: 'data',
-        params: {
-            userId: 1
-        }
-    }
-});
-
-
Defined By

Config Options

Other Configs

 

Any additional options to be passed to the request, for example timeout or headers. Defaults to null.

-

Any additional options to be passed to the request, for example timeout or headers. Defaults to null.

-
 
True to have the loader make a request as soon as it is created. Defaults to false. -This argument can also be a set o...

True to have the loader make a request as soon as it is created. Defaults to false. -This argument can also be a set of options that will be passed to load is called.

-
 
Params that will be attached to every request. These parameters -will not be overridden by any params in the load opti...

Params that will be attached to every request. These parameters -will not be overridden by any params in the load options. Defaults to null.

-
 

A function to be called when a load request fails.

-

A function to be called when a load request fails.

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

(optional)

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

- -

DOM events from ExtJs Components

- - -

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

is usually only done when extra value can be added. For example the DataView's -click event passing the node clicked on. To access DOM -events directly from a child element of a Component, we need to specify the element option to -identify the Component property to add a DOM listener to:

- -
new Ext.panel.Panel({
-    width: 400,
-    height: 200,
-    dockedItems: [{
-        xtype: 'toolbar'
-    }],
-    listeners: {
-        click: {
-            element: 'el', //bind to the underlying el property on the panel
-            fn: function(){ console.log('click el'); }
-        },
-        dblclick: {
-            element: 'body', //bind to the underlying body property on the panel
-            fn: function(){ console.log('dblclick body'); }
-        }
-    }
-});
-
- - -

-
 

True or a Ext.LoadMask configuration to enable masking during loading. Defaults to false.

-

True or a Ext.LoadMask configuration to enable masking during loading. Defaults to false.

-
 
Any params to be attached to the Ajax request. These parameters will -be overridden by any params in the load options....

Any params to be attached to the Ajax request. These parameters will -be overridden by any params in the load options. Defaults to null.

-
 
The type of content that is to be loaded into, which can be one of 3 types: - - -html : Loads raw html content, see Ext....

The type of content that is to be loaded into, which can be one of 3 types:

- -
    -
  • html : Loads raw html content, see Ext.Component.html
  • -
  • data : Loads raw html content, see Ext.Component.data
  • -
  • component : Loads child {Ext.Component} instances. This option is only valid when used with a Container.
  • -
- - -

Defaults to html.

- -

Alternatively, you can pass a function which is called with the following parameters.

- -
    -
  • loader - Loader instance
  • -
  • response - The server response
  • -
  • active - The active request
  • -
- - -

The function must return false is loading is not successful. Below is a sample of using a custom renderer:

- -
new Ext.Component({
-    loader: {
-        url: 'myPage.php',
-        renderer: function(loader, response, active) {
-            var text = response.responseText;
-            loader.getTarget().update('The response is ' + text);
-            return true;
-        }
-    }
-});
-
-
 

The scope to execute the success and failure functions in.

-

The scope to execute the success and failure functions in.

-
 

True to parse any inline script tags in the response. This only used when using the html -renderer.

-

True to parse any inline script tags in the response. This only used when using the html -renderer.

-
 

A function to be called when a load request is successful.

-

A function to be called when a load request is successful.

-
 

The target Ext.Component for the loader. Defaults to null. -If a string is passed it will be looked up via the id.

-

The target Ext.Component for the loader. Defaults to null. -If a string is passed it will be looked up via the id.

-
 

The url to retrieve the content from. Defaults to null.

-

The url to retrieve the content from. Defaults to null.

-
Defined By

Methods

 

Aborts the active load request

-

Aborts the active load request

-

Returns

  • void    -
 
addEvents( -Object/String o, String ) - : void

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 -or the first event name string if multiple event names are being passed as separate parameters.

    -
  • : String

    [additional] Optional additional event names if multiple event names are being passed as separate parameters. -Usage:

    - -
    this.addEvents('storeloaded', 'storecleared');
    -
    - -

Returns

  • void    -
 
addListener( -String eventName, Function handler, [Object scope], [Object options]) - : void

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. May also be an object who's property names are event names. See

    -
  • handler : Function

    The method the event invokes.

    -
  • scope : Object

    (optional) The scope (this reference) in which the handler function is executed. -If omitted, defaults to the object which fired the event.

    -
  • options : Object

    (optional) An object containing handler configuration. -properties. This may contain any of the following properties:

      -
    • scope : Object
      The scope (this reference) in which the handler function is executed. -If 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 -by the specified number of milliseconds. If the event fires again within that time, the original -handler 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 -if the event was bubbled up from a child Observable.
    • -
    • element : String
      This option is only valid for listeners bound to Components. -The name of a Component property which references an element to add a listener to.

      - -

      This option is useful during Component construction to add DOM event listeners to elements of Components which -will exist only after the Component is rendered. For example, to add a click listener to a Panel's body: -

      new Ext.panel.Panel({
      -    title: 'The title',
      -    listeners: {
      -        click: this.handlePanelClick,
      -        element: 'body'
      -    }
      -});
      -

      - - -

      When added in this way, the options available are the options applicable to Ext.core.Element.addListener

      - - -

    • -

    - -

    -Combining Options
    -Using the options argument, it is possible to combine different types of listeners:
    -
    -A delayed, one-time listener. -

    myPanel.on('hide', this.handleClick, this, {
    -single: true,
    -delay: 100
    -});
    -

    -Attaching multiple handlers in 1 call
    -The method also allows for a single argument to be passed which is a config object containing properties -which specify multiple events. For example: -

    myGridPanel.on({
    -    cellClick: this.onCellClick,
    -    mouseover: this.onMouseOver,
    -    mouseout: this.onMouseOut,
    -    scope: this // Important. Ensure "this" is correct during handler execution
    -});
    -
    . -

    - -

Returns

  • void    -
 
addManagedListener( -Observable/Element item, Object/String ename, Function fn, Object scope, Object opt) - : void

Adds listeners to any Observable object (or Element) which are automatically removed when this Component -is destroyed. - -

Adds listeners to any Observable object (or Element) which are automatically removed when this Component -is destroyed. - -

Parameters

  • item : Observable/Element

    The item to which to add a listener/listeners.

    -
  • ename : Object/String

    The event name, or an object containing event name properties.

    -
  • fn : Function

    Optional. If the ename parameter was an event name, this -is the handler function.

    -
  • scope : Object

    Optional. If the ename parameter was an event name, this -is the scope (this reference) in which the handler function is executed.

    -
  • opt : Object

    Optional. If the ename parameter was an event name, this -is the addListener options.

    -

Returns

  • void    -
 
capture( -Observable o, Function fn, [Object scope]) - : void
Starts capture on the specified Observable. All events will be passed -to the supplied function with the event name + ...

Starts capture on the specified Observable. All events will be passed -to the supplied function with the event name + standard signature of the event -before the event is fired. If the supplied function returns false, -the event will not fire.

-

Parameters

  • o : Observable

    The Observable to capture events from.

    -
  • fn : Function

    The function to call when an event is fired.

    -
  • scope : Object

    (optional) The scope (this reference) in which the function is executed. Defaults to the Observable firing the event.

    -

Returns

  • void    -
 

Removes all listeners for this object including the managed listeners

-

Removes all listeners for this object including the managed listeners

-

Returns

  • void    -
 

Removes all managed listeners for this object.

-

Removes all managed listeners for this object.

-

Returns

  • void    -
 

Destroys the loader. Any active requests will be aborted.

-

Destroys the loader. Any active requests will be aborted.

-

Returns

  • void    -
 
enableBubble( -String/Array events) - : void
Enables events fired by this Observable to bubble up an owner hierarchy by calling -this.getBubbleTarget() if present....

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

- - -

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

- - -

Example:

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

Parameters

  • events : String/Array

    The event name to bubble, or an Array of event names.

    -

Returns

  • void    -
 
fireEvent( -String eventName, Object... args) - : Boolean
Fires the specified event with the passed parameters (minus the event name). - - -An event may be set to bubble up an Ob...

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

- - -

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

- -

Parameters

  • eventName : String

    The name of the event to fire.

    -
  • args : Object...

    Variable number of parameters are passed to handlers.

    -

Returns

  • Boolean   

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

    -
 

Get the target of this loader.

-

Get the target of this loader.

-

Returns

  • Ext.Component   

    target The target, null if none exists.

    -
 
hasListener( -String 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

    -

Returns

  • Boolean   

    True if the event is being listened for, else false

    -
 

Checks whether the loader is automatically refreshing. See startAutoRefresh.

-

Checks whether the loader is automatically refreshing. See startAutoRefresh.

-

Returns

  • Boolean   

    True if the loader is automatically refreshing

    -
 
load( -Object options) - : void

Load new data from the server.

-

Load new data from the server.

-

Parameters

  • options : Object

    The options for the request. They can be any configuration option that can be specified for -the class, with the exception of the target option. Note that any options passed to the method will override any -class defaults.

    -

Returns

  • void    -
 
observe( -Function c, Object listeners) - : void
Sets observability on the passed class constructor. - -This makes any event fired on any instance of the passed class a...

Sets observability on the passed class constructor.

- -

This makes any event fired on any instance of the passed class also fire a single event through -the class allowing for central handling of events on many instances at once.

- -

Usage:

- -
Ext.util.Observable.observe(Ext.data.Connection);
-Ext.data.Connection.on('beforerequest', function(con, options) {
-    console.log('Ajax request made to ' + options.url);
-});
-
-

Parameters

  • c : Function

    The class constructor to make observable.

    -
  • listeners : Object

    An object containing a series of listeners to add. See addListener.

    -

Returns

  • void    -
 
on( -String eventName, Function handler, [Object scope], [Object options]) - : void

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

    -
  • handler : Function

    The method the event invokes

    -
  • scope : Object

    (optional) The scope (this reference) in which the handler function is executed. -If omitted, defaults to the object which fired the event.

    -
  • options : Object

    (optional) An object containing handler configuration.

    -

Returns

  • void    -
 
relayEvents( -Object origin, Array events, Object prefix) - : void

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

  • origin : Object

    The Observable whose events this object is to relay.

    -
  • events : Array

    Array of event names to relay.

    -
  • prefix : Object
    -

Returns

  • void    -
 

Removes all added captures from the Observable.

-

Removes all added captures from the Observable.

-

Parameters

  • o : Observable

    The Observable to release

    -

Returns

  • void    -
 
removeListener( -String eventName, Function handler, [Object scope]) - : void

Removes an event handler.

-

Removes an event handler.

-

Parameters

  • eventName : String

    The type of event the handler was associated with.

    -
  • handler : Function

    The handler to remove. This must be a reference to the function passed into the addListener call.

    -
  • scope : Object

    (optional) The scope originally specified for the handler.

    -

Returns

  • void    -
 
removeManagedListener( -Observable|Element item, Object|String ename, Function fn, Object scope) - : void

Removes listeners that were added by the mon method.

-

Removes listeners that were added by the mon method.

-

Parameters

  • item : Observable|Element

    The item from which to remove a listener/listeners.

    -
  • ename : Object|String

    The event name, or an object containing event name properties.

    -
  • fn : Function

    Optional. If the ename parameter was an event name, this -is the handler function.

    -
  • scope : Object

    Optional. If the ename parameter was an event name, this -is the scope (this reference) in which the handler function is executed.

    -

Returns

  • void    -
 
Resume firing events. (see suspendEvents) -If events were suspended using the queueSuspended parameter, then all -event...

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

-

Returns

  • void    -
 
setOptions( -Object active, Object options) - : Ext.Component

Get the target of this loader.

-

Get the target of this loader.

-

Parameters

  • active : Object
    -
  • options : Object
    -

Returns

  • Ext.Component   

    target The target, null if none exists.

    -
 
setTarget( -String/Ext.Component target) - : void
Set a {Ext.Component} as the target of this loader. Note that if the target is changed, -any active requests will be a...

Set a {Ext.Component} as the target of this loader. Note that if the target is changed, -any active requests will be aborted.

-

Parameters

  • target : String/Ext.Component

    The component to be the target of this loader. If a string is passed -it will be looked up via its id.

    -

Returns

  • void    -
 
startAutoRefresh( -Number interval, [Object options]) - : void

Automatically refreshes the content over a specified period.

-

Automatically refreshes the content over a specified period.

-

Parameters

  • interval : Number

    The interval to refresh in ms.

    -
  • options : Object

    (optional) The options to pass to the load method. See load

    -

Returns

  • void    -
 

Clears any auto refresh. See startAutoRefresh.

-

Clears any auto refresh. See startAutoRefresh.

-

Returns

  • void    -
 
suspendEvents( -Boolean queueSuspended) - : void

Suspend the firing of all events. (see resumeEvents)

-

Suspend the firing of all events. (see resumeEvents)

-

Parameters

  • queueSuspended : Boolean

    Pass as true to queue up suspended events to be fired -after the resumeEvents call instead of discarding all suspended events;

    -

Returns

  • void    -
 
un( -String eventName, Function handler, [Object scope]) - : void

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.

    -
  • handler : Function

    The handler to remove. This must be a reference to the function passed into the addListener call.

    -
  • scope : Object

    (optional) The scope originally specified for the handler.

    -

Returns

  • void    -
Defined By

Events

 
beforeload( -Ext.ElementLoader this, Object options) -
Fires before a load request is made to the server. -Returning false from an event listener can prevent the load -from o...

Fires before a load request is made to the server. -Returning false from an event listener can prevent the load -from occurring.

-

Parameters

  • this : Ext.ElementLoader
    -
  • options : Object

    The options passed to the request

    -
 
exception( -Ext.ElementLoader this, Object response, Object options) -

Fires after a successful load.

-

Fires after a successful load.

-

Parameters

  • this : Ext.ElementLoader
    -
  • response : Object

    The response from the server

    -
  • options : Object

    The options passed to the request

    -
\ No newline at end of file