X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/3789b528d8dd8aad4558e38e22d775bcab1cbd36..refs/heads/master:/docs/source/ComponentQuery.html diff --git a/docs/source/ComponentQuery.html b/docs/source/ComponentQuery.html index 14c7c567..2b4af6cd 100644 --- a/docs/source/ComponentQuery.html +++ b/docs/source/ComponentQuery.html @@ -3,8 +3,8 @@
/** - * @class Ext.ComponentQuery - * @extends Object - * - * Provides searching of Components within Ext.ComponentManager (globally) or a specific + * Provides searching of Components within Ext.ComponentManager (globally) or a specific * Ext.container.Container on the document with a similar syntax to a CSS selector. * * Components can be retrieved by using their {@link Ext.Component xtype} with an optional . prefix -<ul> - <li>component or .component</li> - <li>gridpanel or .gridpanel</li> -</ul> + * + * - `component` or `.component` + * - `gridpanel` or `.gridpanel` * * An itemId or id must be prefixed with a # -<ul> - <li>#myContainer</li> -</ul> * + * - `#myContainer` * * Attributes must be wrapped in brackets -<ul> - <li>component[autoScroll]</li> - <li>panel[title="Test"]</li> -</ul> * - * Member expressions from candidate Components may be tested. If the expression returns a <i>truthy</i> value, - * the candidate Component will be included in the query:<pre><code> -var disabledFields = myFormPanel.query("{isDisabled()}"); -</code></pre> + * - `component[autoScroll]` + * - `panel[title="Test"]` + * + * Member expressions from candidate Components may be tested. If the expression returns a *truthy* value, + * the candidate Component will be included in the query: + * + * var disabledFields = myFormPanel.query("{isDisabled()}"); + * + * Pseudo classes may be used to filter results in the same way as in {@link Ext.DomQuery DomQuery}: + * + * // Function receives array and returns a filtered array. + * Ext.ComponentQuery.pseudos.invalid = function(items) { + * var i = 0, l = items.length, c, result = []; + * for (; i < l; i++) { + * if (!(c = items[i]).isValid()) { + * result.push(c); + * } + * } + * return result; + * }; + * + * var invalidFields = myFormPanel.query('field:invalid'); + * if (invalidFields.length) { + * invalidFields[0].getEl().scrollIntoView(myFormPanel.body); + * for (var i = 0, l = invalidFields.length; i < l; i++) { + * invalidFields[i].getEl().frame("red"); + * } + * } + * + * Default pseudos include: * - * Pseudo classes may be used to filter results in the same way as in {@link Ext.DomQuery DomQuery}:<code><pre> -// Function receives array and returns a filtered array. -Ext.ComponentQuery.pseudos.invalid = function(items) { - var i = 0, l = items.length, c, result = []; - for (; i < l; i++) { - if (!(c = items[i]).isValid()) { - result.push(c); - } - } - return result; -}; - -var invalidFields = myFormPanel.query('field:invalid'); -if (invalidFields.length) { - invalidFields[0].getEl().scrollIntoView(myFormPanel.body); - for (var i = 0, l = invalidFields.length; i < l; i++) { - invalidFields[i].getEl().frame("red"); - } -} -</pre></code> - * <p> - * Default pseudos include:<br /> * - not - * </p> + * - last * * Queries return an array of components. * Here are some example queries. -<pre><code> - // retrieve all Ext.Panels in the document by xtype - var panelsArray = Ext.ComponentQuery.query('panel'); - - // retrieve all Ext.Panels within the container with an id myCt - var panelsWithinmyCt = Ext.ComponentQuery.query('#myCt panel'); - - // retrieve all direct children which are Ext.Panels within myCt - var directChildPanel = Ext.ComponentQuery.query('#myCt > panel'); - - // retrieve all gridpanels and listviews - var gridsAndLists = Ext.ComponentQuery.query('gridpanel, listview'); -</code></pre> - -For easy access to queries based from a particular Container see the {@link Ext.container.Container#query}, -{@link Ext.container.Container#down} and {@link Ext.container.Container#child} methods. Also see -{@link Ext.Component#up}. - * @singleton + * + * // retrieve all Ext.Panels in the document by xtype + * var panelsArray = Ext.ComponentQuery.query('panel'); + * + * // retrieve all Ext.Panels within the container with an id myCt + * var panelsWithinmyCt = Ext.ComponentQuery.query('#myCt panel'); + * + * // retrieve all direct children which are Ext.Panels within myCt + * var directChildPanel = Ext.ComponentQuery.query('#myCt > panel'); + * + * // retrieve all grids and trees + * var gridsAndTrees = Ext.ComponentQuery.query('gridpanel, treepanel'); + * + * For easy access to queries based from a particular Container see the {@link Ext.container.Container#query}, + * {@link Ext.container.Container#down} and {@link Ext.container.Container#child} methods. Also see + * {@link Ext.Component#up}. */ Ext.define('Ext.ComponentQuery', { singleton: true, @@ -252,28 +244,22 @@ Ext.define('Ext.ComponentQuery', { method: filterFnPattern }]; - /** - * @class Ext.ComponentQuery.Query - * @extends Object - * @private - */ + // @class Ext.ComponentQuery.Query + // This internal class is completely hidden in documentation. cq.Query = Ext.extend(Object, { constructor: function(cfg) { cfg = cfg || {}; Ext.apply(this, cfg); }, - /** - * @private - * Executes this Query upon the selected root. - * The root provides the initial source of candidate Component matches which are progressively - * filtered by iterating through this Query's operations cache. - * If no root is provided, all registered Components are searched via the ComponentManager. - * root may be a Container who's descendant Components are filtered - * root may be a Component with an implementation of getRefItems which provides some nested Components such as the - * docked items within a Panel. - * root may be an array of candidate Components to filter using this Query. - */ + // Executes this Query upon the selected root. + // The root provides the initial source of candidate Component matches which are progressively + // filtered by iterating through this Query's operations cache. + // If no root is provided, all registered Components are searched via the ComponentManager. + // root may be a Container who's descendant Components are filtered + // root may be a Component with an implementation of getRefItems which provides some nested Components such as the + // docked items within a Panel. + // root may be an array of candidate Components to filter using this Query. execute : function(root) { var operations = this.operations, i = 0, @@ -364,19 +350,27 @@ Ext.define('Ext.ComponentQuery', { } } return results; + }, + last: function(components) { + return components[components.length - 1]; } }, /** - * <p>Returns an array of matched Components from within the passed root object.</p> - * <p>This method filters returned Components in a similar way to how CSS selector based DOM - * queries work using a textual selector string.</p> - * <p>See class summary for details.</p> - * @param selector The selector string to filter returned Components - * @param root <p>The Container within which to perform the query. If omitted, all Components - * within the document are included in the search.</p> - * <p>This parameter may also be an array of Components to filter according to the selector.</p> - * @returns {Array} The matched Components. + * Returns an array of matched Components from within the passed root object. + * + * This method filters returned Components in a similar way to how CSS selector based DOM + * queries work using a textual selector string. + * + * See class summary for details. + * + * @param {String} selector The selector string to filter returned Components + * @param {Ext.container.Container} root The Container within which to perform the query. + * If omitted, all Components within the document are included in the search. + * + * This parameter may also be an array of Components to filter according to the selector.</p> + * @returns {Ext.Component[]} The matched Components. + * * @member Ext.ComponentQuery */ query: function(selector, root) { @@ -415,8 +409,8 @@ Ext.define('Ext.ComponentQuery', { /** * Tests whether the passed Component matches the selector string. - * @param component The Component to test - * @param selector The selector string to test against. + * @param {Ext.Component} component The Component to test + * @param {String} selector The selector string to test against. * @return {Boolean} True if the Component matches the selector. * @member Ext.ComponentQuery */