1. #1
    Sencha User
    Join Date
    Mar 2008
    Posts
    47
    Vote Rating
    0
    mchambaud is on a distinguished road

      0  

    Post Panel onClick event

    Panel onClick event


    Hello

    I want to open a new Ext.Window() when the user clicks on a panel.. I used

    PHP Code:
    myPanel.on('click', function() {..}); 
    but it did not work... I looked in the docs and found that there's no public event click on a panel...

    I also tried this but it did not do anything.. tried several panel.event, none worked!...
    PHP Code:
           var myPanel = new Ext.Panel({
            
    html'foobar',
            
    baseCls'someClass',
            
    listeners: {
                
    activate: function(){
                    
    Ext.Msg.alert('test','test');              
                }
            }
        }); 
    How could I go around that?
    Any examples of working with panels and events? click events on panel?

  2. #2
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,508
    Vote Rating
    57
    Animal has a spectacular aura about Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    Browser events are available directly from DOM elements. So it's an element of the Panel that you want. That's header, body, footer, or getEl() for the overall element.

    Panels do not fire an activate event unless they are chldren of a TabPanel, and that TabPanel activates them.

  3. #3
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,508
    Vote Rating
    57
    Animal has a spectacular aura about Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    And obviously the Panel has to be rendered before you can access its elements to add listsners...

  4. #4
    Sencha User
    Join Date
    Mar 2008
    Posts
    47
    Vote Rating
    0
    mchambaud is on a distinguished road

      0  

    Default


    any examples... I kinda lost lol

  5. #5
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,508
    Vote Rating
    57
    Animal has a spectacular aura about Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    In your Ext examples/* directories. About 80 of them. Plus the Community Manual in the "Learn" section. Plus the API docs about Observable and Element.

  6. #6
    Sencha User
    Join Date
    Mar 2008
    Posts
    47
    Vote Rating
    0
    mchambaud is on a distinguished road

      0  

    Default


    Ok made it work thx!!!

  7. #7
    Ext User Stripeman's Avatar
    Join Date
    Apr 2008
    Location
    Heidelberg Germany
    Posts
    275
    Vote Rating
    0
    Stripeman is on a distinguished road

      0  

    Default care to post

    care to post


    Quote Originally Posted by mchambaud View Post
    Ok made it work thx!!!
    Care to share your example please ?

    Thanks much!

  8. #8
    Ext User
    Join Date
    Feb 2009
    Posts
    11
    Vote Rating
    1
    rahma is on a distinguished road

      0  

    Default


    mchambaud could you share your example please!

  9. #9
    Ext User
    Join Date
    Feb 2009
    Posts
    11
    Vote Rating
    1
    rahma is on a distinguished road

      1  

    Default


    hi finally i succed attaching a click event listener to a panel and this is an example :

    var simple = new Ext.Panel({
    frame:true,
    defaultType:'label',
    items: [
    {text:'réf :'},
    {text: 'famille :'},
    {text: 'classmt :'}
    ],
    listeners: {render: function(c) {c.body.on('click', function() { alert('onclick');});},
    scope: this
    }
    });

  10. #10
    Ext User Rencom's Avatar
    Join Date
    Mar 2010
    Posts
    14
    Vote Rating
    2
    Rencom is on a distinguished road

      2  

    Default


    Quote Originally Posted by rahma View Post
    hi finally i succed attaching a click event listener to a panel and this is an example :

    var simple = new Ext.Panel({
    frame:true,
    defaultType:'label',
    items: [
    {text:'réf :'},
    {text: 'famille :'},
    {text: 'classmt :'}
    ],
    listeners: {render: function(c) {c.body.on('click', function() { alert('onclick');});},
    scope: this
    }
    });
    hm, i dont know you bind `click` event to `body`... i did the same but with `el`:
    Code:
    c.el.on(...)
    may be someone will find this useful.