examples/menu/actions.js

   1 /*\r
   2  * Ext JS Library 2.2.1\r
   3  * Copyright(c) 2006-2009, Ext JS, LLC.\r
   4  * licensing@extjs.com\r
   5  * \r
   6  * http://extjs.com/license\r
   7  */\r
   8 \r
   9 Ext.onReady(function(){\r
  10     // The action\r
  11     var action = new Ext.Action({\r
  12         text: 'Action 1',\r
  13         handler: function(){\r
  14             Ext.example.msg('Click','You clicked on "Action 1".');\r
  15         },\r
  16         iconCls: 'blist'\r
  17     });\r
  18 \r
  19 \r
  20     var panel = new Ext.Panel({\r
  21         title: 'Actions',\r
  22         width:600,\r
  23         height:300,\r
  24         bodyStyle: 'padding:10px;',     // lazy inline style\r
  25 \r
  26         tbar: [\r
  27             action, {                   // <-- Add the action directly to a toolbar\r
  28                 text: 'Action Menu',\r
  29                 menu: [action]          // <-- Add the action directly to a menu\r
  30             }\r
  31         ],\r
  32 \r
  33         items: [\r
  34            new Ext.Button(action)       // <-- Add the action as a button\r
  35         ],\r
  36 \r
  37         renderTo: Ext.getBody()\r
  38     });\r
  39 \r
  40 \r
  41     // Buttons added to the toolbar of the Panel above\r
  42     // to test/demo doing group operations with an action\r
  43     panel.getTopToolbar().add('->', {\r
  44         text: 'Disable',\r
  45         handler: function(){\r
  46             action.setDisabled(!action.isDisabled());\r
  47             this.setText(action.isDisabled() ? 'Enable' : 'Disable');\r
  48         }\r
  49     }, {\r
  50         text: 'Change Text',\r
  51         handler: function(){\r
  52             Ext.Msg.prompt('Enter Text', 'Enter new text for Action 1:', function(btn, text){\r
  53                 if(btn == 'ok' && text){\r
  54                     action.setText(text);\r
  55                     action.setHandler(function(){\r
  56                         Ext.example.msg('Click','You clicked on "'+text+'".');\r
  57                     });\r
  58                 }\r
  59             });\r
  60         }\r
  61     }, {\r
  62         text: 'Change Icon',\r
  63         handler: function(){\r
  64             action.setIconClass(action.getIconClass() == 'blist' ? 'bmenu' : 'blist');\r
  65         }\r
  66     });\r
  67 });