1. #1
    Sencha User
    Join Date
    Oct 2011
    Posts
    24
    Vote Rating
    0
    deepaknair.g is on a distinguished road

      0  

    Exclamation Issue in adding LISTENER to carousel element(can't access items within the carousel)

    Issue in adding LISTENER to carousel element(can't access items within the carousel)


    Hi,
    I have a tab panel as parent.Inside that I have two panels.In one of that panel,I have a carousel and a list.
    I have to add listeners to the carousel by making object to refer the items within the carousel . Let me show the code of my carousel. Hopefully awaiting your reply.
    Code:
    
    Ext.define('Sencha.view.Article', { extend: 'Ext.Carousel',
    xtype: 'articlespage',
    
    layout: 'card',
    cardSwitchAnimation: 'fade',
    config: {
    title: 'Articles',
    iconCls: 'star',
    height: 400,
    
    items: [
    {
    html:"some html text and image here",
    style: 'background-color:#110310;',
    ui:'light'
    
    
    },
    
    
    {
    html:"some html text and image here",
    style: 'background-color:#110310;',
    ui:'light'
    
    
    }
    
    
    ],
    listeners:
    {
    // Here I couldn't get access to the object of carousel.I couldn't use "this" or "xtype" here.// 
    
    }
    
    }
    });
    

  2. #2
    Sencha - Services Team AndreaCammarata's Avatar
    Join Date
    Jun 2009
    Posts
    1,394
    Vote Rating
    22
    AndreaCammarata has a spectacular aura about AndreaCammarata has a spectacular aura about

      0  

    Default


    Hi.
    What kind of listener you would like to refer to a carousel child?
    I mean, when you switch between a card to another one, when you tap on a card, etc..
    Are you using MVC pattern?
    Sencha Inc
    Andrea Cammarata, Solutions Engineer
    CEO at SIMACS

    @AndreaCammarata
    www.andreacammarata.com
    github: https://github.com/AndreaCammarata

    TUX components bundle for Sencha Touch 2.x.x
    http://www.tux-components.com/


  3. #3
    Sencha User
    Join Date
    Oct 2011
    Posts
    24
    Vote Rating
    0
    deepaknair.g is on a distinguished road

      0  

    Default


    Hi,
    I am using the MVC pattern.I want to add listeners on both,while switching the cards (for enable autosliding) as well as tapping the item..But
    whenever I use 'this' or 'xtype' and calls a function,an error is occurred..Can you help me? Thanks in advance

  4. #4
    Sencha User
    Join Date
    Oct 2011
    Posts
    24
    Vote Rating
    0
    deepaknair.g is on a distinguished road

      0  

    Default


    I found some difficulties while dealing with the ST2 MVC.One problem is that,I can't define a function inside listeners as "afterRender". Even 'console.log' or 'alert' is not working if it is put inside a function definition.
    Code:
      
    listeners:            {  afterRender:function()
                   {console.log('hello')}
                 }
    Even this does not work.Is there any other way to define afterRender?

  5. #5
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,754
    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


    To access the correct scope, you need to specify the listener within a method:

    Code:
    constructor: function(config) {
        Ext.apply(this.listeners, {
            event : function
        });
    
        this.callParent(arguments);
    }
    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.

  6. #6
    Sencha User
    Join Date
    Oct 2011
    Posts
    24
    Vote Rating
    0
    deepaknair.g is on a distinguished road

      0  

    Default


    Hi,
    It didn't work.Can you give some explanations for your code.I couldn't understand it properly.Should I specify the event as "function",or should I mention "afterRender" or "painted" instead of "function".Let me send you my updated code.Can you mention the changes I have to make?



    Code:
      Ext.define('Sencha.view.Article', {
     extend: 'Ext.Carousel',
        alias: 'widget.articlespage',
     constructor: function(config) {  
        Ext.apply(this.listeners, {
            event : afterRender
        });
    
    
        this.callParent(arguments);
     },
             
       
        config: {
            title: 'Articles',
            iconCls: 'star',
            height: 400,
          
               
          items: [
                {
                    html:"<div style='float:left;width:100%;'><div style='float:left;width:50%;margin-top:30px;'><h1>Title - 1</h1>Built with HTML5 Canvas, Touch Charts includes gesture-based <a href='#'>Read More >></a></div><div style='float:left;width:50%;'><img src='resources/images/art.jpg' border='0'/></div></div>",
                     style: 'background-color:#110310;',
                     ui:'light'
    
    
                },
                {
                    html:"<div style='float:left;width:100%;'><div style='float:left;width:50%;margin-top:30px;'><h1>Title - 2</h1>Built with HTML5 Canvas, Touch Charts includes gesture-based <a href='#'>Read More >></a></div><div style='float:left;width:50%;'><img src='resources/images/mn1.jpg' border='0'/></div></div>",
                 style: 'background-color:#110310;',
                     ui:'light'
    
    
                    
                },
                {
                    html:"<div style='float:left;width:100%;'><div style='float:left;width:50%;margin-top:30px;'><h1>Title - 3</h1>Built with HTML5 Canvas, Touch Charts includes gesture-based <a href='#'>Read More >></a></div><div style='float:left;width:50%;'><img src='resources/images/wtc.jpg' border='0'/></div></div>",
                     style: 'background-color:#110310;',
                     ui:'light'
    
    
    
    
                },
                {
                    html:"<div style='float:left;width:100%;'><div style='float:left;width:50%;margin-top:30px;'><h1>Title - 4</h1>Built with HTML5 Canvas, Touch Charts includes gesture-based <a href='#'>Read More >></a></div><div style='float:left;width:50%;'><img src='resources/images/kp.jpg' border='0'/></div></div>",
                    style: 'background-color:#110310;',
                     ui:'light'
    
    
    
    
                },
               
    
    
            ],
               
         
                      
           listeners:
                {  afterRender:function()
                {console.log('hello')}
                }
                  
        }    
        
    });
    
    
    


    Hopefully waiting for your answer....



  7. #7
    Sencha - Sencha Touch Dev Team rdougan's Avatar
    Join Date
    Oct 2008
    Posts
    1,158
    Vote Rating
    6
    rdougan will become famous soon enough

      0  

    Default


    You can listen to the painted event.

    We generally always pass the component instance as the first argument to all events. This is currently a little inconsistent, but we are trying to improve this in 2.x.
    Sencha Inc.
    Robert Dougan - @rdougan
    Sencha Touch 2 and Ext JS 4 Core Team Member, SASS/Theming Wizard.

  8. #8
    Sencha - Sencha Touch Dev Team rdougan's Avatar
    Join Date
    Oct 2008
    Posts
    1,158
    Vote Rating
    6
    rdougan will become famous soon enough

      0  

    Default


    And to fix your issue, add this method into your definition:

    Code:
    initialize: function() {
        this.on({
            scope: this,
            
            painted: function() {
                console.log('do something');
            }
        });
    }
    Sencha Inc.
    Robert Dougan - @rdougan
    Sencha Touch 2 and Ext JS 4 Core Team Member, SASS/Theming Wizard.

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