1. #1
    Sencha User
    Join Date
    Sep 2011
    Posts
    23
    Vote Rating
    0
    eryx is on a distinguished road

      0  

    Default Answered: listener property versus on method

    Answered: listener property versus on method


    Hey I have a small question regarding the activate event. I have a tabpanel and on first activate I load some external data.

    PHP Code:
    app.views.NewsCard Ext.extend(
        
    Ext.Panel, {
        
    id'newsCard',
        
    layout'card',
        
    title'News',
        
    iconCls'news',
        
    listeners: {
            
    singletrue,
            
    activate: function () {
                var 
    helper app.utils.Helper;
                if (
    app.handlers.Network.checkDevice()) {
                    
    helper.showMask('newsCard');
                    
    app.handlers.NetRequest.news();
                } else {
                    
    //offlinemode try to load cached data
                    
    helper.showMask('newsCard');
                    
    app.stores.newsStore.load({
                        
    callback: function () {
                            
    helper.hideMask('newsCard');
                        }
                    });
                }
            }
        },

        
    initComponent: function () {
            var 
    newstpl = new Ext.XTemplate(
                
    '<tpl for=".">',
                
    '<tpl if="xindex == 1">',
                        
    '<tpl if="this.isNotEmpty(values.imagebig) === true">',
                            
    '<div class="newspicbig"><img src="{[this.decodeContent(values.imagebig)]}"></div>',
                        
    '</tpl>',
                        
    '<div class="newsTitle">{[this.decodeContent(values.title)]}',
                            
    '<div class="newsAge floatRight">',
                                
    '{newsage}',
                            
    '</div>',
                        
    '</div>',
                        
    '<div class="newsDescriptionBig floatLeft">',
                            
    '{[this.decodeContent(values.content)]}',
                        
    '</div>',
                        
    '<div class="floatRight disclosure">',
                            
    '<img src="resources/images/disclosure.png">',
                        
    '</div>',
                    
    '</tpl>',
                    
    '<tpl if="xindex &gt; 1">',
                        
    '<tpl if="this.isNotEmpty(values.imagesmall) === true">',
                            
    '<div class="newspic floatLeft"><img src="{[this.decodeContent(values.imagesmall)]}"/></div>',
                        
    '</tpl>',
                        
    '<div class="newsTitle">{[this.decodeContent(values.title)]}',
                            
    '<div class="newsAge floatRight">',
                                
    '{newsage}',
                            
    '</div>',
                        
    '</div>',
                        
    '<div class="newsDescription">',
                            
    '{[this.decodeContent(values.content)]}',
                        
    '</div>',
                        
    '<div class="floatRight disclosure">',
                            
    '<img src="resources/images/disclosure.png">',
                        
    '</div>',
                    
    '</tpl>',
                
    '</tpl>',
                {
                    
    isNotEmpty: function (image) {
                        return (
    image !== "" && image !== undefined) ? true false;
                    },
                    
    decodeContent: function (content) {
                        return 
    decodeURIComponent(content);
                    }
                }
            );

            
    this.newsList = new Ext.List({
                
    id'newsList',
                
    storeapp.stores.newsStore,
                
    emptyText'<div class="emptymsg">Konnte keine Daten laden. ' +
                    
    'Bitte verbinden Sie sich mit dem Internet und benutzen Sie den Refresh-Button</div>',
                
    itemTplnewstpl,
                
    loadingText'',
                
    onItemDisclosurefalse,
                
    listeners: {
                    
    selectionchange: {
                        
    fnthis.onSelect,
                        
    scopethis
                    
    }
                }
            });

            
    this.newsPanel = new Ext.Panel({
                
    layout'fit',
                
    itemsthis.newsList,
                
    dockedItems: [{
                    
    xtype'toolbar',
                    
    title'News',
                    
    items: [
                        {
                            
    xtype'spacer'
                        
    }, {
                            
    id'newsbtn',
                            
    ui'plain',
                            
    iconCls'refresh',
                            
    iconMasktrue,
                            
    listeners: {
                                
    'tap': {
                                    
    fnapp.handlers.Refresh.refreshData,
                                    
    buffer500
                                
    }
                            }
                        }
                    ]
                }]
            });
            
    this.items this.newsPanel;
            
    app.views.NewsCard.superclass.initComponent.call(this);
        },


        
    onSelect: function (selrecords) {
            if (
    records[0] !== undefined) {
                var 
    detailCard = new app.views.NewsDetail({
                    
    prevCardthis.newsPanel,
                    
    recordrecords[0]
                });
                
    this.setActiveItem(detailCard'slide');
            }
        }
    }); 
    As you can see i set the listener property on that view and listen once for the activate event. But I was once told that this is not a good idea.
    I'm now not sure what method would be better the only other idea I had was that instead of using the listener property I could use the on method. But I think that makes no difference or am I wrong?

    like this
    PHP Code:
    this.on('activate', function () {
                var 
    helper app.utils.Helper;
                if (
    app.handlers.Network.checkDevice()) {
                    
    helper.showMask('newsCard');
                    
    app.handlers.NetRequest.news();
                } else {
                    
    //offlinemode try to load cached data
                    
    helper.showMask('newsCard');
                    
    app.stores.newsStore.load({
                        
    callback: function () {
                            
    helper.hideMask('newsCard');
                        }
                    });
                }
            }, 
    this, {singletrue}); 
    I would be really happy if someone could tell me whats the better way to go and I really appreciate your time

    Best regards eryx

  2. listener should only be used when creating an instance and on within a component.

  3. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,756
    Answers
    3462
    Vote Rating
    828
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    listener should only be used when creating an instance and on within a component.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  4. #3
    Sencha User
    Join Date
    Sep 2011
    Posts
    23
    Vote Rating
    0
    eryx is on a distinguished road

      0  

    Default Thanks

    Thanks


    That makes sense thank you!

    Greetings eryx

Thread Participants: 1

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi