3.0 beta 2

How to add multiple event listeners

I have subclassed AW.UI.Grid.

I would like all instances of this new subclass to react in a certain way to some particular events: onCellMouseOver and onScrollBarsChanging

I can set the event listeners fine.

obj.init = function(){
this.onCellMouseOver = this.defaultOnCellMouseOver;

However if someone creates an instance and wants to apply there own listener to the event:


, then my listener is no longer activated.

Also, an unrelated question: how does one enter code examples in this forum so that it is formatted correcly?
July 5,
ok, let make a example for u:
function MultipleListeners() {
   this._listeners = [];
   this._size = 0;

   this.addListener = function(fun) {
     this._listeners[this._size++] = fun;

   this.init = function() {

   this.callback = function() {

    this.handleEvent = function() {
      for(var i=0;i<this._size;i++) this._listeners[i].call();
var v1 = new MultipleListeners();
function callback01() {
function callback02() {

Hope this help.
Paulo Cesar Silva Reis (PC from Brazil).
July 5,
Thanks much Paulo.

That helps but I was hoping for a solution that wouldn't involve changing the api.

That is the subclass user would still be able to do this:


Essentially, my question is: is there another way that my superclass can to listen to an event without explictly setting this property.
July 5,
U cant do that with "function = function", u need use array interface, its the only way to save all listeners or implement "JAVA POO" like:

// 2 listeners
public class Father {
   public void printMe() {
       System.out.println("father! yeah, its me!");

public class Child extends Father {
   public void printMe() {
      System.out.println("oh... its the child! Where re my father?");

// main class
Father father = new Father();
Father child = new Child();

Paulo Cesar Silva Reis (PC from Brazil).
July 5,
There are two ways of adding event listeners. The simple one, intended for the control users, just attach the event handler to the object itself -

obj.onCellMouseOver = eventHandlerFunction;

There is also another method, intended for the control developer, where you can attach/remove/replace a group of related event handlers, called 'controller'. The controller is just an assosiative array of eventName:eventHandlerFunction pairs

var mouseController = {
  onCellMouseOver: function1,
  onCellMouseOut: function2

You can assign the controller using setController(name, controllerObject) method -

obj.setController("mouse", mouseController);

Several controllers can contain handlers for the same event, in this case all of them will be executed. The event handler attached directly to the object will be executed first and returning non-zero error code will cancel execution of event handlers in the controllers.

The controllers support special case where you can specify the name of other event instead of actual event handler -

var keyboardController = {
  onKeyLeft: "selectPreviousCell",
  onKeyRight: "selectNextCell"

var selectionController = {
  selectPreviousCell: function1,
  selectNextCell: function2

Alex (ActiveWidgets)
July 10,
Alex, that was exactly what I was looking for. Graci!
July 10,

This topic is archived.

See also:

Back to support forum


Version 2

Looking for AW 2.6 ?
The old site is here.