Saturday, December 15, 2012

Sencha Touch's most frustrating problem

I love Sencha Touch ! . So if you think I am writing something bad about Sencha Touch, no way ! If you are really frustrated with something not working in your Sencha touch app ( or may be Ext.js but I dont use it) , CHECK YOUR COMPONENT-QUERIES.

At first glance, you may find it obvious or trivial, but if by mistake you use just "button" instead of button[name='myAction'] as a component query, you would hate to see whats going on ! Because when you click that button, not only myAction event will be fired, but all button events will be fired, throwing your app into confusion loop.

If you want to know what is component-query.. Go and check this link.

http://docs.sencha.com/touch/2-0/#!/api/Ext.ComponentQuery

Essentially, component query is used when adding events for user clicks/touches. The event handler should be triggered only when a particular button is clicked, so you name the button and use component query to trigger event handler only when that particular button is clicked/touched. Again, events can be many, button event here is just an example.

Additionally, if you are using Sencha Architect to add event handlers, architect adds component query by default (for example, "button") ! If you forget to change to button[name='myAction'], you would end quite good time to find out what's going on !

This is like Java programmer looking for instanceof "Object", always the answer is Yes.

Yup, you may find it easily if you have console logs in the handler functions, if not, surely you will go in that frustration cycle as I have gone two times now. First time, in fact I thought Sencha is not worth it ! But I was wrong !

My tweets on similar topics