X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/2e847cf21b8ab9d15fa167b315ca5b2fa92638fc..7a654f8d43fdb43d78b63d90528bed6e86b608cc:/docs/api/Ext.ComponentQuery.html diff --git a/docs/api/Ext.ComponentQuery.html b/docs/api/Ext.ComponentQuery.html new file mode 100644 index 00000000..af671040 --- /dev/null +++ b/docs/api/Ext.ComponentQuery.html @@ -0,0 +1,128 @@ +Ext.ComponentQuery | Ext JS 4.0 Documentation +
For up to date documentation and features, visit +http://docs.sencha.com/ext-js/4-0

Sencha Documentation

+ + + + + +

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

+ +
    +
  • component or .component
  • +
  • gridpanel or .gridpanel
  • +
+ + +

An itemId or id must be prefixed with a #

+ +
    +
  • #myContainer
  • +
+ + +

Attributes must be wrapped in brackets

+ +
    +
  • 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 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.

+
Defined By

Methods

 
query( +Object component, Object selector) + : Boolean

Tests whether the passed Component matches the selector string.

+

Tests whether the passed Component matches the selector string.

+

Parameters

  • component : Object

    The Component to test

    +
  • selector : Object

    The selector string to test against.

    +

Returns

  • Boolean   

    True if the Component matches the selector.

    +
\ No newline at end of file