|
|
Ext.menu Namespace
Download SDK: SharpKit.ExtJs.zip
Classes
|
CheckItem
|
A menu item that contains a togglable checkbox by default, but that can also be a part of a radio group. Example Usage Ext.create('Ext.menu.Menu', {
width: 100,
height: 110,
floating: false, // usually you want this set to True (default)
renderTo: Ext.getBody(), // usually rendered by it's containing component
items: [{
xtype: 'menucheckitem',
text: 'select all'
},{
xtype: 'menucheckitem',
text: 'select specific',
},{
iconCls: 'add16',
text: 'icon item'
},{
text: 'regular item'
}]
});
|
|
CheckItemConfig
|
|
|
CheckItemEvents
|
|
|
ColorPicker
|
A menu containing a Ext.picker.Color Component. Notes: Although not listed here, the constructor for this class
accepts all of the configuration options of Ext.picker.Color. If subclassing ColorMenu, any configuration options for the ColorPicker must be
applied to the initialConfig property of the ColorMenu.
Applying ColorPicker configuration settings to
this will not affect the ColorPicker's configuration. Example Usage var colorPicker = Ext.create('Ext.menu.ColorPicker', {
value: '000000'
});
Ext.create('Ext.menu.Menu', {
width: 100,
height: 90,
floating: false, // usually you want this set to True (default)
renderTo: Ext.getBody(), // usually rendered by it's containing component
items: [{
text: 'choose a color',
menu: colorPicker
},{
iconCls: 'add16',
text: 'icon item'
},{
text: 'regular item'
}]
});
|
|
ColorPickerConfig
|
|
|
ColorPickerEvents
|
|
|
DatePicker
|
A menu containing an Ext.picker.Date Component. Notes: Although not listed here, the constructor for this class
accepts all of the configuration options of Ext.picker.Date. If subclassing DateMenu, any configuration options for the DatePicker must be
applied to the initialConfig property of the DateMenu.
Applying DatePicker configuration settings to
this will not affect the DatePicker's configuration. Example Usage var dateMenu = Ext.create('Ext.menu.DatePicker', {
handler: function(dp, date){
Ext.Msg.alert('Date Selected', 'You choose {0}.', Ext.Date.format(date, 'M j, Y'));
}
});
Ext.create('Ext.menu.Menu', {
width: 100,
height: 90,
floating: false, // usually you want this set to True (default)
renderTo: Ext.getBody(), // usually rendered by it's containing component
items: [{
text: 'choose a date',
menu: dateMenu
},{
iconCls: 'add16',
text: 'icon item'
},{
text: 'regular item'
}]
});
|
|
DatePickerConfig
|
|
|
DatePickerEvents
|
|
|
Item
|
A base class for all menu items that require menu-related functionality such as click handling,
sub-menus, icons, etc. Example Usage: Ext.create('Ext.menu.Menu', {
width: 100,
height: 100,
floating: false, // usually you want this set to True (default)
renderTo: Ext.getBody(), // usually rendered by it's containing component
items: [{
text: 'icon item',
iconCls: 'add16'
},{
text: 'text item',
},{
text: 'plain item',
plain: true
}]
});
|
|
ItemConfig
|
|
|
ItemEvents
|
|
|
Manager
|
Provides a common registry of all menus on a page.
|
|
ManagerConfig
|
|
|
ManagerEvents
|
|
|
Menu
|
A menu object. This is the container to which you may add menu items. Menus may contain either menu items, or general Components.
Menus may also contain docked items because it extends Ext.panel.Panel. To make a contained general Component line up with other menu items,
specify iconCls: 'no-icon' or indent: true.
This reserves a space for an icon, and indents the Component in line with the other menu items.
See Ext.form.field.ComboBox.getListParent for an example. By default, Menus are absolutely positioned, floating Components. By configuring a Menu with floating:false,
a Menu may be used as a child of a Container. Example Usage Ext.create('Ext.menu.Menu', {
width: 100,
height: 100,
margin: '0 0 10 0',
floating: false, // usually you want this set to True (default)
renderTo: Ext.getBody(), // usually rendered by it's containing component
items: [{
text: 'regular item 1'
},{
text: 'regular item 2'
},{
text: 'regular item 3'
}]
});
Ext.create('Ext.menu.Menu', {
width: 100,
height: 100,
plain: true,
floating: false, // usually you want this set to True (default)
renderTo: Ext.getBody(), // usually rendered by it's containing component
items: [{
text: 'plain item 1'
},{
text: 'plain item 2'
},{
text: 'plain item 3'
}]
});
|
|
MenuConfig
|
|
|
MenuEvents
|
|
|
Separator
|
Adds a separator bar to a menu, used to divide logical groups of menu items. Generally you will
add one of these by using "-" in your call to add() or in your items config rather than creating one directly. Code Ext.create('Ext.menu.Menu', {
width: 100,
height: 100,
floating: false, // usually you want this set to True (default)
renderTo: Ext.getBody(), // usually rendered by it's containing component
items: [{
text: 'icon item',
iconCls: 'add16'
},{
xtype: 'menuseparator'
},{
text: 'seperator above',
},{
text: 'regular item',
}]
});
|
|
SeparatorConfig
|
|
|
SeparatorEvents
|
|
|