CODEWITHSUNDEEP
extjssencha-touch-2
Dinkheller
Dinkheller

Reputation: 5074

Sencha Touch 2 button loose listener

I have a button in a Sencha Touch 2 project. The button gets destroyed with the view after being pressed and is rebuild after another button gets pressed.

But the button does not get the listener again.

the listener is build in the controller of the view.

 Ext.application({
 name: 'App',
 controllers: ['Main','Home'],
 views: ['Main','Home'],
 launch: function () {Ext.Viewport.add({xtype:'mainview'});} 
 });

the controller

Ext.define('App.controller.Home', {extend: 'Ext.app.Controller',
config: {
    refs: {homeView: '#homeview',backBtn: '#btn_test1'},
    control: {
        backBtn: {
             tap: function(backBtn){
                console.log('[Controller][Home] btn monatsrate - - tap');
                 Ext.Viewport.add({xtype: 'mainview'});
                 Ext.Viewport.setActiveItem(1);
             }
        },
        homeView: {
            deactivate: function (homeView){
                console.log('[Controller][Home] autodestroy homeview');
                //homeView.destroy();
                Ext.Viewport.remove(homeView);
            }
        }
    }

},
});

And the view

Ext.define("App.view.Main", {
extend:"Ext.Container",
xtype:"mainview",
config:{
    id:'mainview',
    items:[
        {
            xtype:'button',
            id:'btn_test2',
            text: 'test2'
        }
    ]
},

});

Any idea how to allow the button to get the listener back?

Upvotes: 4

Views: 1579

Answers (3)

Adam Klein
Adam Klein

Reputation: 401

Sencha's examples recommend using action config on buttons, like 'cancel', 'goHome', 'createPost', etc.. which kinda makes sense.
All refs are then in the form of: myContainer button[action=myAction]

Upvotes: 1

igrek
igrek

Reputation: 1425

I believe your issue is exactly the id parameter. If you ever add any id you should make sure it is unique, thus adding an id to a config of your custom view will result in no way to create more then one instance of it! I may not be a 100% right(might be inside a container but i believe it will cause issues anyway) but why would you want an id that much? Besides, you can simply reference your view by xtype:

refs: {homeView: 'homeview',backBtn: 'btn_test1'},

regards,

Upvotes: 0

user714241
user714241

Reputation: 380

This is because the "ref" in your controller is using the id of the button to create the ref. Instead, use a different selector for your button. For example you could give your button a "name" property and give it a value of "testbutton". Then your ref would be like

refs: {homeView: '#homeview',backBtn: 'button[name=testbutton]'},

I struggled with this same problem for buttons and list items that were created/destroyed many times throughout the application's flow. Since then I've read a few times that, in general, the Sencha Touch team recommends not using the id as the selector unless you have a specific reason to. The "name" method above works very well for me. You could use lots of other css-style selectors as well (you'd have to read up on that separately).

As mentioned in a previous comment, I would accept some answers to increase the probability of getting an answer to your questions in the future. I'm just answering this one because I beat my head against the wall on this issue for 4 hours.

Upvotes: 3

Related Questions