Class type Ext_util_Observable.t

class type t = object .. end

method hasListeners : 'a. 'a Js.t Js.readonly_prop

This object holds a key for any event that has a listener. The listener may be set directly on the instance, or on its class or a super class (via observe) or on the MVC EventBus. The values of this object are truthy (a non-zero number) and falsy (0 or undefined). They do not represent an exact count of listeners. The value for an event is truthy if the event must be fired and is falsy if there is no need to fire the event.

The intended use of this property is to avoid the expense of fireEvent calls when there are no listeners. This can be particularly helpful when one would otherwise have to call fireEvent hundreds or thousands of times. It is used like this:

 if (this.hasListeners.foo) {
     this.fireEvent('foo', this, arg1);
 }

method isObservable : bool Js.t Js.prop

true in this class to identify an object as an instantiated Observable, or subclass thereof.

Defaults to: true

method addEvents : 'b. 'b Js.t -> unit Js.meth

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

Parameters:

• eventNames: _ Js.t

  Either an object with event names as properties with a value of true. For example:

  this.addEvents({
      storeloaded: true,
      storecleared: true
  });
  

  Or any number of event names as separate parameters. For example:

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

method addListener : 'c 'd 'e 'f 'g.
         'c Js.t ->
         'd Js.callback Js.optdef ->
         'e Js.t Js.optdef -> 'f Js.t Js.optdef -> 'g Js.t Js.meth

Appends an event handler to this object. For example:

myGridPanel.on("mouseover", this.onMouseOver, this);

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
});

One can also specify options for each event handler separately:

myGridPanel.on({
    cellClick: {fn: this.onCellClick, scope: this, single: true},
    mouseover: {fn: panel.onMouseOver, scope: panel}
});

Names of methods in a specified scope may also be used. Note that scope MUST be specified to use this option:

myGridPanel.on({
    cellClick: {fn: 'onCellClick', scope: this, single: true},
    mouseover: {fn: 'onMouseOver', scope: panel}
});

Parameters:

• eventName: _ Js.t

  The name of the event to listen for. May also be an object who's property names are event names.

• fn: _ Js.callback (optional)

  The method the event invokes, or if scope is specified, the name* of the method within the specified scope. Will be called with arguments given to fireEvent plus the options parameter described below.

• scope: _ Js.t (optional)

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

• options: _ Js.t (optional)

  An object containing handler configuration.

  Note: Unlike in ExtJS 3.x, the options object will also be passed as the last argument to every event handler.

  This object may contain any of the following properties:

Returns:

• _ Js.t

  Only when the destroyable option is specified.

  A Destroyable object. An object which implements the destroy method which removes all listeners added in this call. For example:

  this.btnListeners =  = myButton.on({
      destroyable: true
      mouseover:   function() { console.log('mouseover'); },
      mouseout:    function() { console.log('mouseout'); },
      click:       function() { console.log('click'); }
  });
  

  And when those listeners need to be removed:

  Ext.destroy(this.btnListeners);
  

  or

  this.btnListeners.destroy();
  

method addManagedListener : 'h 'i 'j 'k 'l 'm.
         'h Js.t ->
         'i Js.t ->
         'j Js.callback Js.optdef ->
         'k Js.t Js.optdef -> 'l Js.t Js.optdef -> 'm Js.t Js.meth

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

Parameters:

• item: _ Js.t

  The item to which to add a listener/listeners.

• ename: _ Js.t

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

• fn: _ Js.callback (optional)

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

• scope: _ Js.t (optional)

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

• options: _ Js.t (optional)

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

Returns:

• _ Js.t

  Only when the destroyable option is specified.

  A Destroyable object. An object which implements the destroy method which removes all listeners added in this call. For example:

  this.btnListeners =  = myButton.mon({
      destroyable: true
      mouseover:   function() { console.log('mouseover'); },
      mouseout:    function() { console.log('mouseout'); },
      click:       function() { console.log('click'); }
  });
  

  And when those listeners need to be removed:

  Ext.destroy(this.btnListeners);
  

  or

  this.btnListeners.destroy();
  

method clearListeners : unit Js.meth

Removes all listeners for this object including the managed listeners

method clearManagedListeners : unit Js.meth

Removes all managed listeners for this object.

method enableBubble : 'n. 'n Js.t -> unit Js.meth

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.define('Ext.overrides.form.field.Base', {
    override: 'Ext.form.field.Base',

    //  Add functionality to Field's initComponent to enable the change event to bubble
    initComponent: function () {
        this.callParent();
        this.enableBubble('change');
    }
});

var myForm = Ext.create('Ext.form.Panel', {
    title: 'User Details',
    items: [{
        ...
    }],
    listeners: {
        change: function() {
            // Title goes red if form has been modified.
            myForm.header.setStyle('color', 'red');
        }
    }
});

Parameters:

• eventNames: _ Js.t

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

method fireEvent : 'o. Js.js_string Js.t -> 'o Js.t -> bool Js.t Js.meth

Fires the specified event with the passed parameters (minus the event name, plus the options object passed to addListener).

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

Parameters:

• eventName: Js.js_string Js.t

  The name of the event to fire.

• args: _ Js.t

  Variable number of parameters are passed to handlers.

Returns:

• bool Js.t

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

method fireEventArgs : 'p. Js.js_string Js.t -> 'p Js.t Js.js_array Js.t -> bool Js.t Js.meth

Fires the specified event with the passed parameter list.

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

Parameters:

• eventName: Js.js_string Js.t

  The name of the event to fire.

• args: _ Js.t Js.js_array Js.t

  An array of parameters which are passed to handlers.

Returns:

• bool Js.t

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

method hasListener : Js.js_string Js.t -> bool Js.t Js.meth

Checks to see if this object has any listeners for a specified event, or whether the event bubbles. The answer indicates whether the event needs firing or not.

Parameters:

• eventName: Js.js_string Js.t

  The name of the event to check for

Returns:

• bool Js.t

  true if the event is being listened for or bubbles, else false

method mon : 'q 'r 's 't 'u 'v.
         'q Js.t ->
         'r Js.t ->
         's Js.callback Js.optdef ->
         't Js.t Js.optdef -> 'u Js.t Js.optdef -> 'v Js.t Js.meth

Shorthand for addManagedListener.

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

Parameters:

• item: _ Js.t

  The item to which to add a listener/listeners.

• ename: _ Js.t

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

• fn: _ Js.callback (optional)

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

• scope: _ Js.t (optional)

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

• options: _ Js.t (optional)

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

Returns:

• _ Js.t

  Only when the destroyable option is specified.

  A Destroyable object. An object which implements the destroy method which removes all listeners added in this call. For example:

  this.btnListeners =  = myButton.mon({
      destroyable: true
      mouseover:   function() { console.log('mouseover'); },
      mouseout:    function() { console.log('mouseout'); },
      click:       function() { console.log('click'); }
  });
  

  And when those listeners need to be removed:

  Ext.destroy(this.btnListeners);
  

  or

  this.btnListeners.destroy();
  

method mun : 'w 'x 'y 'z.
         'w Js.t ->
         'x Js.t -> 'y Js.callback Js.optdef -> 'z Js.t Js.optdef -> unit Js.meth

Shorthand for removeManagedListener.

Removes listeners that were added by the mon method.

Parameters:

• item: _ Js.t

  The item from which to remove a listener/listeners.

• ename: _ Js.t

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

• fn: _ Js.callback (optional)

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

• scope: _ Js.t (optional)

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

method on : 'a1 'b1 'c1 'd1 'e1.
         'a1 Js.t ->
         'b1 Js.callback Js.optdef ->
         'c1 Js.t Js.optdef -> 'd1 Js.t Js.optdef -> 'e1 Js.t Js.meth

Shorthand for addListener.

Appends an event handler to this object. For example:

myGridPanel.on("mouseover", this.onMouseOver, this);

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
});

One can also specify options for each event handler separately:

myGridPanel.on({
    cellClick: {fn: this.onCellClick, scope: this, single: true},
    mouseover: {fn: panel.onMouseOver, scope: panel}
});

Names of methods in a specified scope may also be used. Note that scope MUST be specified to use this option:

myGridPanel.on({
    cellClick: {fn: 'onCellClick', scope: this, single: true},
    mouseover: {fn: 'onMouseOver', scope: panel}
});

Parameters:

• eventName: _ Js.t

  The name of the event to listen for. May also be an object who's property names are event names.

• fn: _ Js.callback (optional)

  The method the event invokes, or if scope is specified, the name* of the method within the specified scope. Will be called with arguments given to fireEvent plus the options parameter described below.

• scope: _ Js.t (optional)

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

• options: _ Js.t (optional)

  An object containing handler configuration.

  Note: Unlike in ExtJS 3.x, the options object will also be passed as the last argument to every event handler.

  This object may contain any of the following properties:

Returns:

• _ Js.t

  Only when the destroyable option is specified.

  A Destroyable object. An object which implements the destroy method which removes all listeners added in this call. For example:

  this.btnListeners =  = myButton.on({
      destroyable: true
      mouseover:   function() { console.log('mouseover'); },
      mouseout:    function() { console.log('mouseout'); },
      click:       function() { console.log('click'); }
  });
  

  And when those listeners need to be removed:

  Ext.destroy(this.btnListeners);
  

  or

  this.btnListeners.destroy();
  

method relayEvents : 'f1 'g1.
         'f1 Js.t ->
         Js.js_string Js.t Js.js_array Js.t ->
         Js.js_string Js.t Js.optdef -> 'g1 Js.t Js.meth

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

For example if you are extending Grid, you might decide to forward some events from store. So you can do this inside your initComponent:

this.relayEvents(this.getStore(), ['load']);

The grid instance will then have an observable 'load' event which will be passed the parameters of the store's load event and any function fired with the grid's load event would have access to the grid using the this keyword.

Parameters:

• origin: _ Js.t

  The Observable whose events this object is to relay.

• events: Js.js_string Js.t Js.js_array Js.t

  Array of event names to relay.

• prefix: Js.js_string Js.t (optional)

  A common prefix to prepend to the event names. For example:

  this.relayEvents(this.getStore(), ['load', 'clear'], 'store');
  

  Now the grid will forward 'load' and 'clear' events of store as 'storeload' and 'storeclear'.

Returns:

• _ Js.t

  A Destroyable object. An object which implements the destroy method which, when destroyed, removes all relayers. For example:

  this.storeRelayers = this.relayEvents(this.getStore(), ['load', 'clear'], 'store');
  

  Can be undone by calling

  Ext.destroy(this.storeRelayers);
  

  or this.store.relayers.destroy();

method removeListener : 'h1 'i1.
         Js.js_string Js.t -> 'h1 Js.callback -> 'i1 Js.t Js.optdef -> unit Js.meth

Removes an event handler.

Parameters:

• eventName: Js.js_string Js.t

  The type of event the handler was associated with.

• fn: _ Js.callback

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

• scope: _ Js.t (optional)

  The scope originally specified for the handler. It must be the same as the scope argument specified in the original call to addListener or the listener will not be removed.

method removeManagedListener : 'j1 'k1 'l1 'm1.
         'j1 Js.t ->
         'k1 Js.t -> 'l1 Js.callback Js.optdef -> 'm1 Js.t Js.optdef -> unit Js.meth

Removes listeners that were added by the mon method.

Parameters:

• item: _ Js.t

  The item from which to remove a listener/listeners.

• ename: _ Js.t

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

• fn: _ Js.callback (optional)

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

• scope: _ Js.t (optional)

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

method resumeEvent : Js.js_string Js.t -> unit Js.meth

Resumes firing of the named event(s).

After calling this method to resume events, the events will fire when requested to fire.

Note that if the suspendEvent method is called multiple times for a certain event, this converse method will have to be called the same number of times for it to resume firing.

Parameters:

• eventName: Js.js_string Js.t

  Multiple event names to resume.

method resumeEvents : unit Js.meth

Resumes 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.

method suspendEvent : Js.js_string Js.t -> unit Js.meth

Suspends firing of the named event(s).

After calling this method to suspend events, the events will no longer fire when requested to fire.

Note that if this is called multiple times for a certain event, the converse method resumeEvent will have to be called the same number of times for it to resume firing.

Parameters:

• eventName: Js.js_string Js.t

  Multiple event names to suspend.

method suspendEvents : bool Js.t -> unit Js.meth

Suspends the firing of all events. (see resumeEvents)

Parameters:

• queueSuspended: bool Js.t

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

method un : 'n1 'o1.
         Js.js_string Js.t -> 'n1 Js.callback -> 'o1 Js.t Js.optdef -> unit Js.meth

Shorthand for removeListener.

Removes an event handler.

Parameters:

• eventName: Js.js_string Js.t

  The type of event the handler was associated with.

• fn: _ Js.callback

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

• scope: _ Js.t (optional)

  The scope originally specified for the handler. It must be the same as the scope argument specified in the original call to addListener or the listener will not be removed.