Following is the code snippet which will give an idea of my work -
DynamicDropdownMenu = function(parent, id) {
DwtComposite.call(this, {parent
arent,
className:"DynamicDropdownMenu", id:id});
//render menu - called only once
this._createHtml();
};
DynamicDropdownMenu.prototype._createHtml =
function() {
//Render the template
this.getHtmlElement().innerHTML = AjxTemplate.expand
("share.Widgets#DynamicDropdownMenuTemplate", {id:this._htmlElId});
//id for dynamic menu btn
var dynamicMenuBtnId = this._htmlElId + "_dynamicMenuButton";
//dynamic menu btn
var dynamicMenuBtn = document.getElementById(dynamicMenuBtnId);
//if get an div id from template then create the btn and add it to div
if (dynamicMenuBtn ) {
this._dynamicMenuButton = this._addButton({ tdId: "_dynamicMenuButton",buttonId:"zb__DYNAMIC__ME NU", lbl: "Default Menu Item", icon:"Person" });
//menu is a callback
var menu = new AjxCallback(this, this._dynamicMenu);
//set menu to dynamic menu btn
this._workspaceMenuButton.setMenu(menu, false,
DwtMenuItem.RADIO_STYLE);
this._dynamicMenuButton.reparentHtmlElement(worksp aceMenuBtnId);
}else{
//error case
alert("There is some error in Dynamic Menu initialization.");
}
};
DynamicDropdownMenu.prototype._dynamicMenu = function(){
//create DwtMenu
//items details is stored in array
//iterate over array and add items to the menu
//register listeners for items
//return menu
};
As can be seen above, menu generation happens only once i.e. during instantiation. Is there any way to do it at real time say when user clicks on DynamicMenuButton. I tried this by adding a listener to button however it affects the menu associated with button. After adding button listener it leaves tiny space for a user (down arrow on menu) to click to expand the menu. I think, it could be because now there are two listeners associated with button and button listener takes priority over menu listener.
Any pointer on this?