/*
* - LGPL
*
- * row
+ * menu item
*
*/
* @extends Roo.bootstrap.Component
* Bootstrap MenuItem class
* @cfg {String} html the menu label
- * @cfg {String} href the link
+ * @cfg {String} href the link
+ * @cfg {Boolean} preventDefault do not trigger A href on clicks (default false).
+ * @cfg {Boolean} isContainer is it a container - just returns a drop down item..
+ * @cfg {Boolean} active used on sidebars to highlight active itesm
+ * @cfg {String} fa favicon to show on left of menu item.
+ * @cfg {Roo.bootsrap.Menu} menu the child menu.
*
*
* @constructor
Roo.bootstrap.MenuItem = function(config){
Roo.bootstrap.MenuItem.superclass.constructor.call(this, config);
+ this.addEvents({
+ // raw events
+ /**
+ * @event click
+ * The raw click event for the entire grid.
+ * @param {Roo.bootstrap.MenuItem} this
+ * @param {Roo.EventObject} e
+ */
+ "click" : true
+ });
};
Roo.extend(Roo.bootstrap.MenuItem, Roo.bootstrap.Component, {
-
+
href : false,
html : false,
-
-
+ preventDefault: false,
+ isContainer : false,
+ active : false,
+ fa: false,
getAutoCreate : function(){
+
+ if(this.isContainer){
+ return {
+ tag: 'li',
+ cls: 'dropdown-menu-item '
+ };
+ }
+ var ctag = {
+ tag: 'span',
+ html: 'Link'
+ };
+
+ var anc = {
+ tag : 'a',
+ cls : 'dropdown-item',
+ href : '#',
+ cn : [ ]
+ };
+
+ if (this.fa !== false) {
+ anc.cn.push({
+ tag : 'i',
+ cls : 'fa fa-' + this.fa
+ });
+ }
+
+ anc.cn.push(ctag);
+
+
var cfg= {
- // cls: '',
- tag : 'li',
- cn : [
- {
- tag : 'a',
- href : '#',
- html : 'Link'
- }
- ]
- };
-
- cfg.cn[0].href = this.href || cfg.cn[0].href ;
- cfg.cn[0].html = this.html || cfg.cn[0].html ;
+ tag: 'li',
+ cls: 'dropdown-menu-item',
+ cn: [ anc ]
+ };
+ if (this.parent().type == 'treeview') {
+ cfg.cls = 'treeview-menu';
+ }
+ if (this.active) {
+ cfg.cls += ' active';
+ }
+
+
+
+ anc.href = this.href || cfg.cn[0].href ;
+ ctag.html = this.html || cfg.cn[0].html ;
return cfg;
- }
-
+ },
+
+ initEvents: function()
+ {
+ if (this.parent().type == 'treeview') {
+ this.el.select('a').on('click', this.onClick, this);
+ }
+
+ if (this.menu) {
+ this.menu.parentType = this.xtype;
+ this.menu.triggerEl = this.el;
+ this.menu = this.addxtype(Roo.apply({}, this.menu));
+ }
+
+ },
+ onClick : function(e)
+ {
+ Roo.log('item on click ');
+
+ if(this.preventDefault){
+ e.preventDefault();
+ }
+ //this.parent().hideMenuItems();
+
+ this.fireEvent('click', this, e);
+ },
+ getEl : function()
+ {
+ return this.el;
+ }
});