add extjs 6.0.1 sources

[extjs.git] / extjs / examples / classic / menu / actions.js

Ext.require([\r
    'Ext.panel.Panel',\r
    'Ext.Action',\r
    'Ext.button.Button',\r
    'Ext.window.MessageBox'\r
]);\r
\r
Ext.onReady(function(){\r
    var action = Ext.create('Ext.Action', {\r
        text: 'Action 1',\r
        iconCls: 'icon-add',\r
        handler: function(){\r
            Ext.example.msg('Click', 'You clicked on "Action 1".');\r
        }\r
    });\r
    \r
     var panel = Ext.create('Ext.panel.Panel', {\r
        title: 'Actions',\r
        renderTo: document.body,\r
        width: 600,\r
        height: 300,\r
        bodyPadding: 10,\r
        dockedItems: {\r
            itemId: 'toolbar',\r
            xtype: 'toolbar',\r
            items: [\r
                action, // Add the action directly to a toolbar\r
                {\r
                    text: 'Action menu',\r
                    menu: [action] // Add the action directly to a menu\r
                }\r
            ]\r
        },\r
        items: Ext.create('Ext.button.Button', action)       // Add the action as a button\r
    });\r
    \r
    /*\r
     * Add toolbar items dynamically after creation\r
     */\r
    var toolbar = panel.child('#toolbar');\r
    toolbar.add('->', {\r
        text: 'Disable',\r
        handler: function(){\r
            action.setDisabled(!action.isDisabled());\r
            this.setText(action.isDisabled() ? 'Enable' : 'Disable');\r
        }\r
    }, {\r
        text: 'Change Text',\r
        handler: function(){\r
            Ext.Msg.prompt('Enter Text', 'Enter new text for Action 1:', function(btn, text){\r
                if(btn == 'ok' && text){\r
                    action.setText(text);\r
                    action.setHandler(function(){\r
                        Ext.example.msg('Click','You clicked on "'+text+'".');\r
                    });\r
                }\r
            });\r
        }\r
    }, {\r
        text: 'Change Icon',\r
        handler: function(){\r
            action.setIconCls(action.getIconCls() == 'icon-add' ? 'icon-edit' : 'icon-add');\r
        }\r
    });\r
});\r