docs/source/CompositeElement.html

   1 <html>\r
   2 <head>\r
   3   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    \r
   4   <title>The source code</title>\r
   5     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
   6     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
   7 </head>\r
   8 <body  onload="prettyPrint();">\r
   9     <pre class="prettyprint lang-js"><div id="cls-Ext.CompositeElement"></div>/**\r
  10  * @class Ext.CompositeElement\r
  11  * @extends Ext.CompositeElementLite\r
  12  * <p>This class encapsulates a <i>collection</i> of DOM elements, providing methods to filter\r
  13  * members, or to perform collective actions upon the whole set.</p>\r
  14  * <p>Although they are not listed, this class supports all of the methods of {@link Ext.Element} and\r
  15  * {@link Ext.Fx}. The methods from these classes will be performed on all the elements in this collection.</p>\r
  16  * <p>All methods return <i>this</i> and can be chained.</p>\r
  17  * Usage:\r
  18 <pre><code>\r
  19 var els = Ext.select("#some-el div.some-class", true);\r
  20 // or select directly from an existing element\r
  21 var el = Ext.get('some-el');\r
  22 el.select('div.some-class', true);\r
  23 \r
  24 els.setWidth(100); // all elements become 100 width\r
  25 els.hide(true); // all elements fade out and hide\r
  26 // or\r
  27 els.setWidth(100).hide(true);\r
  28 </code></pre>\r
  29  */\r
  30 Ext.CompositeElement = function(els, root){\r
  31     this.elements = [];\r
  32     this.add(els, root);\r
  33 };\r
  34 \r
  35 Ext.extend(Ext.CompositeElement, Ext.CompositeElementLite, {\r
  36     \r
  37     // private\r
  38     getElement : function(el){\r
  39         // In this case just return it, since we already have a reference to it\r
  40         return el;\r
  41     },\r
  42     \r
  43     // private\r
  44     transformElement : function(el){\r
  45         return Ext.get(el);\r
  46     }\r
  47 \r
  48     /**\r
  49     * Adds elements to this composite.\r
  50     * @param {String/Array} els A string CSS selector, an array of elements or an element\r
  51     * @return {CompositeElement} this\r
  52     */\r
  53 \r
  54     /**\r
  55      * Returns the Element object at the specified index\r
  56      * @param {Number} index\r
  57      * @return {Ext.Element}\r
  58      */\r
  59 \r
  60     <div id="method-Ext.CompositeElement-"></div>/**\r
  61      * Iterates each <code>element</code> in this <code>composite</code>\r
  62      * calling the supplied function using {@link Ext#each}.\r
  63      * @param {Function} fn The function to be called with each\r
  64      * <code>element</code>. If the supplied function returns <tt>false</tt>,\r
  65      * iteration stops. This function is called with the following arguments:\r
  66      * <div class="mdetail-params"><ul>\r
  67      * <li><code>element</code> : <i>Ext.Element</i><div class="sub-desc">The element at the current <code>index</code>\r
  68      * in the <code>composite</code></div></li>\r
  69      * <li><code>composite</code> : <i>Object</i> <div class="sub-desc">This composite.</div></li>\r
  70      * <li><code>index</code> : <i>Number</i> <div class="sub-desc">The current index within the <code>composite</code> </div></li>\r
  71      * </ul></div>\r
  72      * @param {Object} scope (optional) The scope (<code><this</code> reference) in which the specified function is executed.\r
  73      * Defaults to the <code>element</code> at the current <code>index</code>\r
  74      * within the composite.\r
  75      * @return {CompositeElement} this\r
  76      */\r
  77 });\r
  78 \r
  79 /**\r
  80  * Selects elements based on the passed CSS selector to enable {@link Ext.Element Element} methods\r
  81  * to be applied to many related elements in one statement through the returned {@link Ext.CompositeElement CompositeElement} or\r
  82  * {@link Ext.CompositeElementLite CompositeElementLite} object.\r
  83  * @param {String/Array} selector The CSS selector or an array of elements\r
  84  * @param {Boolean} unique (optional) true to create a unique Ext.Element for each element (defaults to a shared flyweight object)\r
  85  * @param {HTMLElement/String} root (optional) The root element of the query or id of the root\r
  86  * @return {CompositeElementLite/CompositeElement}\r
  87  * @member Ext.Element\r
  88  * @method select\r
  89  */\r
  90 Ext.Element.select = function(selector, unique, root){\r
  91     var els;\r
  92     if(typeof selector == "string"){\r
  93         els = Ext.Element.selectorFunction(selector, root);\r
  94     }else if(selector.length !== undefined){\r
  95         els = selector;\r
  96     }else{\r
  97         throw "Invalid selector";\r
  98     }\r
  99 \r
 100     return (unique === true) ? new Ext.CompositeElement(els) : new Ext.CompositeElementLite(els);\r
 101 };\r
 102 \r
 103 <div id="method-Ext.Element-select"></div>/**\r
 104  * Selects elements based on the passed CSS selector to enable {@link Ext.Element Element} methods\r
 105  * to be applied to many related elements in one statement through the returned {@link Ext.CompositeElement CompositeElement} or\r
 106  * {@link Ext.CompositeElementLite CompositeElementLite} object.\r
 107  * @param {String/Array} selector The CSS selector or an array of elements\r
 108  * @param {Boolean} unique (optional) true to create a unique Ext.Element for each element (defaults to a shared flyweight object)\r
 109  * @param {HTMLElement/String} root (optional) The root element of the query or id of the root\r
 110  * @return {CompositeElementLite/CompositeElement}\r
 111  * @member Ext.Element\r
 112  * @method select\r
 113  */\r
 114 Ext.select = Ext.Element.select;</pre>    \r
 115 </body>\r
 116 </html>