Upgrade to ExtJS 3.0.3 - Released 10/11/2009

[extjs.git] / src / util / Observable-more.js

diff --git a/src/util/Observable-more.js b/src/util/Observable-more.js
index 192a50e..e20ae5b 100644 (file)
--- a/src/util/Observable-more.js
+++ b/src/util/Observable-more.js
@@ -1,5 +1,5 @@
 /*!
- * Ext JS Library 3.0.0
+ * Ext JS Library 3.0.3
  * Copyright(c) 2006-2009 Ext JS, LLC
  * licensing@extjs.com
  * http://www.extjs.com/license
@@ -122,21 +122,56 @@ Ext.apply(Ext.util.Observable.prototype, function(){
         },\r
         \r
         /**\r
-         * Used to enable bubbling of events\r
-         * @param {Object} events\r
+         * <p>Enables events fired by this Observable to bubble up an owner hierarchy by calling\r
+         * <code>this.getBubbleTarget()</code> if present. There is no implementation in the Observable base class.</p>\r
+         * <p>This is commonly used by Ext.Components to bubble events to owner Containers. See {@link Ext.Component.getBubbleTarget}. The default\r
+         * implementation in Ext.Component returns the Component's immediate owner. But if a known target is required, this can be overridden to\r
+         * access the required target more quickly.</p>\r
+         * <p>Example:</p><pre><code>\r
+Ext.override(Ext.form.Field, {\r
+//  Add functionality to Field's initComponent to enable the change event to bubble\r
+    initComponent: Ext.form.Field.prototype.initComponent.createSequence(function() {\r
+        this.enableBubble('change');\r
+    }),\r
+\r
+//  We know that we want Field's events to bubble directly to the FormPanel.\r
+    getBubbleTarget: function() {\r
+        if (!this.formPanel) {\r
+            this.formPanel = this.findParentByType('form');\r
+        }\r
+        return this.formPanel;\r
+    }\r
+});\r
+\r
+var myForm = new Ext.formPanel({\r
+    title: 'User Details',\r
+    items: [{\r
+        ...\r
+    }],\r
+    listeners: {\r
+        change: function() {\r
+//          Title goes red if form has been modified.\r
+            myForm.header.setStyle("color", "red");\r
+        }\r
+    }\r
+});\r
+</code></pre>\r
+         * @param {Object} events The event name to bubble, or an Array of event names.\r
          */\r
         enableBubble: function(events){\r
             var me = this;\r
-            events = Ext.isArray(events) ? events : Ext.toArray(arguments);\r
-            Ext.each(events, function(ename){\r
-                ename = ename.toLowerCase();\r
-                var ce = me.events[ename] || true;\r
-                if (typeof ce == "boolean") {\r
-                    ce = new Ext.util.Event(me, ename);\r
-                    me.events[ename] = ce;\r
-                }\r
-                ce.bubble = true;\r
-            });\r
+            if(!Ext.isEmpty(events)){\r
+                events = Ext.isArray(events) ? events : Ext.toArray(arguments);\r
+                Ext.each(events, function(ename){\r
+                    ename = ename.toLowerCase();\r
+                    var ce = me.events[ename] || true;\r
+                    if (Ext.isBoolean(ce)) {\r
+                        ce = new Ext.util.Event(me, ename);\r
+                        me.events[ename] = ce;\r
+                    }\r
+                    ce.bubble = true;\r
+                });\r
+            }\r
         }\r
     };\r
 }());\r