examples/toolbar/reorderable.js

   1 Ext.Loader.setConfig({enabled: true});
   2
   3 Ext.Loader.setPath('Ext.ux', '../ux/');
   4
   5 Ext.require([
   6     'Ext.panel.*',
   7     'Ext.fx.*',
   8     'Ext.toolbar.*',
   9     'Ext.button.*',
  10     'Ext.ux.BoxReorderer'
  11 ]);
  12
  13 Ext.onReady(function() {
  14     var toolbar = Ext.createWidget('toolbar', {
  15         renderTo: Ext.getBody(),
  16         defaults: {
  17             reorderable: true
  18         },
  19         plugins : Ext.create('Ext.ux.BoxReorderer', {}),
  20         items   : [
  21             {
  22                 xtype:'splitbutton',
  23                 text: 'Menu Button',
  24                 iconCls: 'add16',
  25                 menu: [{text: 'Menu Item 1'}],
  26                 reorderable: false
  27             },
  28             {
  29                 xtype:'splitbutton',
  30                 text: 'Cut',
  31                 iconCls: 'add16',
  32                 menu: [{text: 'Cut Menu Item'}]
  33             },
  34             {
  35                 text: 'Copy',
  36                 iconCls: 'add16'
  37             },
  38             {
  39                 text: 'Paste',
  40                 iconCls: 'add16',
  41                 menu: [{text: 'Paste Menu Item'}]
  42             },
  43             {
  44                 text: 'Format',
  45                 iconCls: 'add16'
  46             }
  47         ]
  48     });
  49
  50     Ext.createWidget('panel', {
  51         renderTo: Ext.getBody(),
  52         tbar    : toolbar,
  53         border  : true,
  54         width   : 600,
  55         height  : 400
  56     });
  57 });