Results 1 to 8 of 8

Thread: Button Tap Event in Created Ext.Panel does not fire / execute

    Looks like we cannot reproduce this. Please provide another test case to reproduce this issue.
  1. #1
    Sencha User
    Join Date
    Oct 2007
    Posts
    52

    Default Button Tap Event in Created Ext.Panel does not fire / execute

    PHP Code:
    var panel Ext.create('Ext.Panel', {
        
    width200,
        
    height200,
        
    layout'fit',

        
    items: {
            
    xtype'button',
            
    text'test',
            
    listeners: {
                
    tap: function() {
                    
    alert("test");
                }
            }
        }
    });

    Ext.application({
        
    name 'Fiddle',

        
    launch : function() {
            
    Ext.Viewport.add(panel);
            
    Ext.Msg.alert('Fiddle''Welcome to Sencha Fiddle!');
            
        }
    }); 
    The code above I tested in JSFiddle using Sencha Touch 2.4.1 Crisp.
    The alert is never fired. Though if I change the Ext.application to...

    PHP Code:
    Ext.application({
        
    name 'Fiddle',

        
    launch : function() {
            
    Ext.Viewport.add({
            
    xtype'button',
            
    text'test',
            
    listeners: {
                
    tap: function() {
                    
    alert("test");
                }
            }
        });
            
    Ext.Msg.alert('Fiddle''Welcome to Sencha Fiddle!');
            
        }
    }); 
    adding the button right away, the button event is executed.
    Is this working as intended?


    Thanks

  2. #2
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,449

    Default

    You shouldn't create a component before the launch method fires, you are creating the panel and the button before it. In this simple example this works:



    Also note, that's not JSFiddle, it's Sencha Fiddle
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Fullstack Engineer
    ________________
    Modus Create is based on the model of an open source team. We’re a remote, global team of experts in our field. To find out more about the work we do, head over to our website.

    Check out my GitHub:
    https://github.com/mitchellsimoens

  3. #3
    Sencha User
    Join Date
    Oct 2007
    Posts
    52

    Default

    Hi Mitch!

    Wooops, Sencha Fiddle... lol butterfingers... anywho... is there a way to instantiate and declare them outside the launch then add them during launch? or I have to code everything inside? ( non-mvc route ).

  4. #4
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,449

    Default

    You don't need to have everything within the launch method but they need to be instantiated after the launch method has been executed so that the framework is fully initialized.
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Fullstack Engineer
    ________________
    Modus Create is based on the model of an open source team. We’re a remote, global team of experts in our field. To find out more about the work we do, head over to our website.

    Check out my GitHub:
    https://github.com/mitchellsimoens

  5. #5
    Sencha User
    Join Date
    Oct 2007
    Posts
    52

    Default

    Hi Mitch,

    late reply, Sorry to be nosy, very new to Touch 2.4 and still getting the grasp of this. So what you mean is I instantiate framework,
    PHP Code:
    Ext.application({
        
    name 'Fiddle',

        
    launch : function() {
            
        }
    }); 
    then do this?
    Code:
    var panel = Ext.create('Ext.Panel', { 
                width: 200, 
                height: 200, 
                layout: 'fit',
                items: { 
                    xtype: 'button', 
                    text: 'test', 
                    listeners: { 
                        tap: function() { 
                            alert("test"); 
                        } 
                    } 
                } 
            });
            
            Ext.Viewport.add(panel);
    ?

    thanks

  6. #6
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,449

    Default

    Where is the 2nd code snippet? Is it after the launch method has executed or just after it was defined?
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Fullstack Engineer
    ________________
    Modus Create is based on the model of an open source team. We’re a remote, global team of experts in our field. To find out more about the work we do, head over to our website.

    Check out my GitHub:
    https://github.com/mitchellsimoens

  7. #7
    Sencha User
    Join Date
    Oct 2007
    Posts
    52

    Default

    Oh, sorry, was not clear.... should slook like ....

    PHP Code:
    Ext.application({ 
        
    name 'Fiddle'

        
    launch : function() { 
             
        } 
    });  

    var 
    panel Ext.create('Ext.Panel', { 
                
    width200
                
    height200
                
    layout'fit',
                
    items: { 
                    
    xtype'button'
                    
    text'test'
                    
    listeners: { 
                        
    tap: function() { 
                            
    alert("test"); 
                        } 
                    } 
                } 
            });
            
            
    Ext.Viewport.add(panel); 

  8. #8
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,449

    Default

    That's not have JavaScript works, the launch method isn't executed yet, it's just defined. Put that code within the launch method or somewhere after the launch method has executed.
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Fullstack Engineer
    ________________
    Modus Create is based on the model of an open source team. We’re a remote, global team of experts in our field. To find out more about the work we do, head over to our website.

    Check out my GitHub:
    https://github.com/mitchellsimoens

Similar Threads

  1. Can Ext fire event when component is created?
    By finderetf in forum Ext: Q&A
    Replies: 3
    Last Post: 1 Oct 2013, 5:13 AM
  2. How to handle particular event by the dynamic created button
    By Rameshlamani in forum Sencha Touch 2.x: Discussion
    Replies: 1
    Last Post: 10 Jun 2012, 10:16 AM
  3. Replies: 2
    Last Post: 28 Nov 2011, 12:27 PM
  4. Execute PHP function on button clic event
    By janixams in forum Ext 1.x: Help & Discussion
    Replies: 11
    Last Post: 20 Jul 2008, 7:55 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •