- var tb = panel.getTopToolbar();
- // Buttons added to the toolbar of the Panel above
- // to test/demo doing group operations with an action
- tb.add('->', {
+*/
+Ext.require([
+ 'Ext.panel.Panel',
+ 'Ext.Action',
+ 'Ext.button.Button',
+ 'Ext.window.MessageBox'
+]);
+
+Ext.onReady(function(){
+ var action = Ext.create('Ext.Action', {
+ text: 'Action 1',
+ iconCls: 'icon-add',
+ handler: function(){
+ Ext.example.msg('Click', 'You clicked on "Action 1".');
+ }
+ });
+
+ var panel = Ext.create('Ext.panel.Panel', {
+ title: 'Actions',
+ renderTo: document.body,
+ width: 600,
+ height: 300,
+ bodyPadding: 10,
+ dockedItems: {
+ itemId: 'toolbar',
+ xtype: 'toolbar',
+ items: [
+ action, // Add the action directly to a toolbar
+ {
+ text: 'Action menu',
+ menu: [action] // Add the action directly to a menu
+ }
+ ]
+ },
+ items: Ext.create('Ext.button.Button', action) // Add the action as a button
+ });
+
+ /*
+ * Add toolbar items dynamically after creation
+ */
+ var toolbar = panel.child('#toolbar');
+ toolbar.add('->', {