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 xtype with an optional . prefix
- -An itemId or id must be prefixed with a #
- -Attributes must be wrapped in brackets
- -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 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:
-- not
-
Queries return an array of components. -Here are some example queries.
- - // 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');
-For easy access to queries based from a particular Container see the Ext.container.Container.query, -Ext.container.Container.down and Ext.container.Container.child methods. Also see -Ext.Component.up.
-