The
Dynamic Flyout menu does not render in UCI. Follow these steps to reproduce the
issue and find the solution at the end.
Using Ribbon Workbench, create a Flyout button.
Configure the commands as shown in the screenshots below:
Flyout Button
Social Command
Populate Query Command
Display Rule (this will only show the button on existing records not new records)
Publish the Ribbon
JavaScript Web Resource
Create a JavaScript web resource with this code and publish:
However, the UCI does not show the menu. It shows “No Options Available”.
Now the UCI will also show the dynamic menu.
Important Note
Take special care of spaces and new lines in JavaScript code as those will also break the menu in UCI.
Using Ribbon Workbench, create a Flyout button.
Configure the commands as shown in the screenshots below:
Flyout Button
Social Command
Populate Query Command
Display Rule (this will only show the button on existing records not new records)
Publish the Ribbon
JavaScript Web Resource
Create a JavaScript web resource with this code and publish:
function populateSocialMenu(commandProperties) {
var commandId = 'mypub.phonecall.Command.Social';
var menuXml = '<Menu Id="new.new_dslschema.Button18.Button.Menu">';
menuXml += '<MenuSection Id="new.new_dslschema.Section19.Section" Sequence="10" DisplayMode="Menu16">';
menuXml += '<Controls Id="new.new_dslschema.Section19.Section.Controls">';
menuXml += '<Button Alt="Facebook" Command="' + commandId + '" Id="vrp.vrp_customerproduct.Button.FacebookButton" LabelText="Facebook" Sequence="10" TemplateAlias="o1" ToolTipTitle="Facebook" ToolTipDescription="Facebook" />';
menuXml += '<Button Alt="Twitter" Command="' + commandId + '" Id="vrp.vrp_customerproduct.Button.TwitterButton" LabelText="Twitter" Sequence="20" TemplateAlias="o1" ToolTipTitle="Twitter" ToolTipDescription="Twitter" />';
menuXml += '</Controls>';
menuXml += '</MenuSection>';
menuXml += '</Menu>';
commandProperties["PopulationXML"] = menuXml;
}
function onSocialMenuItemClick(commandProperties) {
debugger;
alert(commandProperties.SourceControlId + ' clicked');
}
Result
As expected, the normal web refresh form will show the dynamic menu.However, the UCI does not show the menu. It shows “No Options Available”.
Solution
Update the JavaScript code as following:function populateSocialMenu(commandProperties) {
var entityName = Xrm.Page.data.entity.getEntityName();
var isUCI = Xrm.Internal.isUci();
var page = "Form";
var commandId = 'mypub.phonecall.Command.Social';
if (isUCI) {
commandId = entityName + "|NoRelationship|" + page + "|" + commandId;
}
var menuXml = '<Menu Id="new.new_dslschema.Button18.Button.Menu">';
menuXml += '<MenuSection Id="new.new_dslschema.Section19.Section" Sequence="10" DisplayMode="Menu16">';
menuXml += '<Controls Id="new.new_dslschema.Section19.Section.Controls">';
menuXml += '<Button Alt="Facebook" Command="' + commandId + '" Id="vrp.vrp_customerproduct.Button.FacebookButton" LabelText="Facebook" Sequence="10" TemplateAlias="o1" ToolTipTitle="Facebook" ToolTipDescription="Facebook" />';
menuXml += '<Button Alt="Twitter" Command="' + commandId + '" Id="vrp.vrp_customerproduct.Button.TwitterButton" LabelText="Twitter" Sequence="20" TemplateAlias="o1" ToolTipTitle="Twitter" ToolTipDescription="Twitter" />';
menuXml += '</Controls>';
menuXml += '</MenuSection>';
menuXml += '</Menu>';
commandProperties["PopulationXML"] = menuXml;
}Now the UCI will also show the dynamic menu.
Important Note
Take special care of spaces and new lines in JavaScript code as those will also break the menu in UCI.