2 * @class Roo.bootstrap.menu.Item
3 * @extends Roo.bootstrap.Component
5 * Bootstrap MenuItem class
6 * @cfg {Boolean} submenu default false -
7 * @cfg {String} html text of the item
8 * @cfg {String} href the link
9 * @cfg {Boolean} disabled is the item disabled - default false
10 * @cfg {Boolean} preventDefault stop trigger click event to parent elements - default true
11 * @cfg {String} fa Font awesome icon
12 * @cfg {String} pos (left|right) Submenu align to default right
13 * @cfg {Roo.bootsrap.Menu} menu the child menu.
17 * Create a new Menu Item
18 * @param {Object} config The config object
22 Roo.bootstrap.menu.Item = function(config){
23 Roo.bootstrap.menu.Item.superclass.constructor.call(this, config);
27 * Fires when the mouse is hovering over this menu
28 * @param {Roo.bootstrap.menu.Item} this
29 * @param {Roo.EventObject} e
34 * Fires when the mouse exits this menu
35 * @param {Roo.bootstrap.menu.Item} this
36 * @param {Roo.EventObject} e
42 * The raw click event for the entire grid.
43 * @param {Roo.EventObject} e
49 Roo.extend(Roo.bootstrap.menu.Item, Roo.bootstrap.Component, {
60 isContainer : false, // ?? only a <li drowdonw-menu-item">
62 getAutoCreate : function()
68 cls: 'dropdown-menu-item '
74 cls : 'roo-menu-item-text',
80 cls : 'dropdown-item',
81 href : this.href || '#',
85 if (this.fa !== false) {
88 cls : 'fa fa-' + this.fa
97 cls: 'dropdown-menu-item',
100 if (this.parent().type == 'treeview') {
101 cfg.cls = 'treeview-menu';
104 cfg.cls += ' active';
108 cfg.cls += ' disabled'
112 cfg.cls += 'dropdown-submenu';
114 if(this.pos == 'left'){
115 cfg.cls += ' pull-left';
118 anc.href = this.href || cfg.cn[0].href ;
119 ctag.html = this.html || cfg.cn[0].html ;
125 initEvents : function()
127 if (this.parent().type == 'treeview') {
128 this.el.select('a').on('click', this.onClick, this);
131 this.menu.parentType = this.xtype;
132 this.menu.triggerEl = this.el;
133 this.menu = this.addxtype(Roo.apply({}, this.menu));
135 this.el.on('mouseover', this.onMouseOver, this);
136 this.el.on('mouseout', this.onMouseOut, this);
138 this.el.select('a', true).first().on('click', this.onClick, this);
142 onClick : function(e)
144 if(this.preventDefault){
148 this.fireEvent("click", this, e);
151 onMouseOver : function(e)
153 if(this.submenu && this.pos == 'left'){
154 this.el.select('ul.dropdown-menu', true).first().setLeft(this.el.select('ul.dropdown-menu', true).first().getWidth() * -1);
157 this.fireEvent("mouseover", this, e);
160 onMouseOut : function(e)
162 this.fireEvent("mouseout", this, e);