Month: March 2013

Ext.ComponentQuery.query or Ext.getCmp

Ext.ComponentQuery.query or Ext.getCmp

When you start with Sencha touch, one of the first things you have to find out is the difference between the following.

Ext.ComponentQuery.query or Ext.getCmp?

Well both do a similar task and yet both are very different. When using them in your Sencha App they will return an item from the visual onscreen assets depending on the parameters you give it.

Same, but different.

Ext.getCmp

will return you an item matching the id you passed it. This will be the fastest method to return an item. All items when created with an id are registered in a single object using their id as a key. So Ext.getCmp( myId) will look up and return theRegistrationObject[“myId”]; So it will be very quick. At the same time its benefit is also its downside. Let’s say you have two components and both have the same id then what happens? Well last in wins. So you might not get back what you where expecting.

Ext.componentQuery.query

This is where Ext.componentQuery.query comes in. It will return an array of items, but it works in a slightly different way. Instead of pulling an item directly from an indexed array (which is dead fast), this will traverse the visual items and create a collection depending on what parameters you give it. If you’re application is really large then this is (potentially) going to be really slow.

In order to make sure its not slow you can pass in a very specific path to get at where your component is located.

E.G. Ext.ComponentQuery.query(
'formpanel selectfield[itemId=dataFilterType]' )[0].getValue();

This will return all selectfield’s that have an itemId of dataFilterType and are children of formpanel. If you know there is only one of these then you can reference the first item in the array and then say gets its value.

I suppose for testing/debugging purposes you should also add an alert/console message if if it returns more than 1 item and you only expect it to return 1.
Might be interesting to see some timings on these calls but that’s for another post.

Update –
Check out this screencast by Jay Garcia on the subject. Plus he explains quite a bit more.