}
};
Roo.extend(Roo.menu.Item, Roo.menu.BaseItem, {
+
+ /**
+ * @cfg {String} text
+ * The text to show on the menu item.
+ */
+ text: '',
+ /**
+ * @cfg {String} HTML to render in menu
+ * The text to show on the menu item (HTML version).
+ */
+ html: '',
/**
* @cfg {String} icon
* The path to an icon to display in this menu item (defaults to Roo.BLANK_IMAGE_URL)
*/
+ icon: undefined,
/**
* @cfg {String} itemCls The default CSS class to use for menu items (defaults to "x-menu-item")
*/
el.target = this.hrefTarget;
}
el.className = this.itemCls + (this.menu ? " x-menu-item-arrow" : "") + (this.cls ? " " + this.cls : "");
+
+ var html = this.html.length ? this.html : String.format('{0}',this.text);
+
el.innerHTML = String.format(
- '<img src="{0}" class="x-menu-item-icon {2}" />{1}',
- this.icon || Roo.BLANK_IMAGE_URL, this.text, this.iconCls || '');
+ '<img src="{0}" class="x-menu-item-icon {1}" />' + html,
+ this.icon || Roo.BLANK_IMAGE_URL, this.iconCls || '');
this.el = el;
Roo.menu.Item.superclass.onRender.call(this, container, position);
},
/**
* Sets the text to display in this menu item
* @param {String} text The text to display
+ * @param {Boolean} isHTML true to indicate text is pure html.
*/
- setText : function(text){
- this.text = text;
+ setText : function(text, isHTML){
+ if (isHTML) {
+ this.html = text;
+ } else {
+ this.text = text;
+ this.html = '';
+ }
if(this.rendered){
+ var html = this.html.length ? this.html : String.format('{0}',this.text);
+
this.el.update(String.format(
- '<img src="{0}" class="x-menu-item-icon {2}">{1}',
+ '<img src="{0}" class="x-menu-item-icon {2}">' + html,
this.icon || Roo.BLANK_IMAGE_URL, this.text, this.iconCls || ''));
this.parentMenu.autoWidth();
}