Sencha Touch 2 button click not working after deployment

Question

I have a sencha touch 2 app which is working flawlessly without deployment. However, when I deploy to either testing, production or native, I have several buttons inside a navigation view with tap events which won't work anymore. No errors are shown. I cannot understand why this is happening only after deployment.

Here is the relevant code:

Controller:

control: {

        '#main-function': {
            tap: 'loadFunction'
         },


         loadMyBoat: function() {
              this.getProducts().up().push({
          xtype: 'myxtype',
         })



         Ext.getStore('Items').getProxy().setUrl('myurl');
         Ext.getStore('Items').load();
},

View:

Ext.define('MyBoat.view.ItemList', {
extend: 'Ext.navigation.View',
xtype: 'myxtype',

config: {
    title: 'My Title',
    styleHtmlContent: true,
    defaultBackButtonText: 'Items List',

    items: {
        xtype: 'list',
        itemTpl: '{Field_Name}',


        title: 'Tap on a boat to access further details',
        store: 'Boats'
    }
}
})

Anyone ever encountered this? Any help would be greatly appreciated.

No errors. That's the weird part :/ Just nothing happens when I click on it. From what I can tell, the controller listener is not being executed. However, the controller is working as I am able to login successfully... Only when I press these buttons its not working — seedg, Jun 08 '12 at 11:32

score 0 · Answer 1 · answered Jun 08 '12 at 15:59

Open up your DOM editor (in chrome, F12 I believe). Your control selector is selecting #main-function, so you'll want to make sure this is a valid selector.

On the console of your developer tools window, type:

Ext.ComponentQuery.query('#main-function')

This should be what the controller is trying.

score 0 · Accepted Answer · answered Jun 12 '12 at 07:28

After lots of debugging I managed to fix the problem. Turns out that using the following code to generate any component will not work well after deployment:

new Ext.button({.....})

Instead you have to use xtypes rather than the new keyword. I think this has something to do with the fact that the deployer stores all the js code in one file and thus since I was using the new keyword, it was being created somewhere in the js file when it actually won't exist in the context. The weird thing is that it does not show any errors so hopefully this will help other folks.

Sencha Touch 2 button click not working after deployment

2 Answers2