actions.js
1.88 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
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('->', {
text: 'Disable',
handler: function(){
action.setDisabled(!action.isDisabled());
this.setText(action.isDisabled() ? 'Enable' : 'Disable');
}
}, {
text: 'Change Text',
handler: function(){
Ext.Msg.prompt('Enter Text', 'Enter new text for Action 1:', function(btn, text){
if(btn == 'ok' && text){
action.setText(text);
action.setHandler(function(){
Ext.example.msg('Click','You clicked on "'+text+'".');
});
}
});
}
}, {
text: 'Change Icon',
handler: function(){
action.setIconCls(action.getIconCls() == 'icon-add' ? 'icon-edit' : 'icon-add');
}
});
});