/ext-4.1.0_b3/examples/menu/actions.js

 1Ext.require([
 2    'Ext.panel.Panel',
 3    'Ext.Action',
 4    'Ext.button.Button',
 5    'Ext.window.MessageBox'
 6]);
 7
 8Ext.onReady(function(){
 9    var action = Ext.create('Ext.Action', {
10        text: 'Action 1',
11        iconCls: 'icon-add',
12        handler: function(){
13            Ext.example.msg('Click', 'You clicked on "Action 1".');
14        }
15    });
16    
17     var panel = Ext.create('Ext.panel.Panel', {
18        title: 'Actions',
19        renderTo: document.body,
20        width: 600,
21        height: 300,
22        bodyPadding: 10,
23        dockedItems: {
24            itemId: 'toolbar',
25            xtype: 'toolbar',
26            items: [
27                action, // Add the action directly to a toolbar
28                {
29                    text: 'Action menu',
30                    menu: [action] // Add the action directly to a menu
31                }
32            ]
33        },
34        items: Ext.create('Ext.button.Button', action)       // Add the action as a button
35    });
36    
37    /*
38     * Add toolbar items dynamically after creation
39     */
40    var toolbar = panel.child('#toolbar');
41    toolbar.add('->', {
42        text: 'Disable',
43        handler: function(){
44            action.setDisabled(!action.isDisabled());
45            this.setText(action.isDisabled() ? 'Enable' : 'Disable');
46        }
47    }, {
48        text: 'Change Text',
49        handler: function(){
50            Ext.Msg.prompt('Enter Text', 'Enter new text for Action 1:', function(btn, text){
51                if(btn == 'ok' && text){
52                    action.setText(text);
53                    action.setHandler(function(){
54                        Ext.example.msg('Click','You clicked on "'+text+'".');
55                    });
56                }
57            });
58        }
59    }, {
60        text: 'Change Icon',
61        handler: function(){
62            action.setIconCls(action.getIconCls() == 'icon-add' ? 'icon-edit' : 'icon-add');
63        }
64    });
65});