Dynamically Populating Ribbon Flyout Menu in Unified Interface

My previous post Dynamically Populating Ribbon Flyout Menu describes the way to add flyout menu buttons dynamically, but that was limited to web client and was not working in unified Interface.

As per my R&D and support ticket with Microsoft, we are still not able to add dynamic Flyout menu buttons directly in Unified Interface (UCI).

The issue is due to the dynamic buttons don't detect the command that we were adding through our JS code, so we need to attach that command to a hidden button so that internally the command is visible.

Following are the two steps we need to achieve the dynamic flyout in both Web client and unified interface. These steps are actually a continuation of my previous post.

Step#1: Adding a button, where you need to call the command that we have used for dynamic buttons.
Add a flyout button and make it hidden.


Add a menu section and then add a button, and call the command here.

Step#2: We need to update the JS code, i.e to append "lead|NoRelationship|Form|" (this is for lead entity form ribbon) at the start of the actual command for UCI.
function populateEnrollmentFlyout(commandProperties) { 
    var programsRibbonXml = "";
    var programs = retrieveMultiple('msd_programs', "?$select=msd_programid,msd_name");
 
    var command="msd.lead.Command.ProgramClicked";

    //This code is used to build the command string for UCI
    if(commandProperties.SourceControlId!=null)
    {
        var source=commandProperties.SourceControlId.split('|');
        if(source.length>3)
        {
             //command="lead|NoRelationship|Form|msd.lead.Command.ProgramClicked"
             command=source[0]+"|"+source[1]+"|"+source[2]+"|"+command;
        }
    }
    programsRibbonXml +="<MenuSection Id='msd.Lead.Programs.MenuSection' Sequence='10'><Controls Id='msd.Lead.Programs.Control'>"
    if (programs != null) {      
        for (var i = 0; i < programs.length; i++) {           
                var Name = programs[i].msd_name;
                var Value = programs[i].msd_programid;                
                programsRibbonXml+="<Button Id='" + Value + "' Command='" + command + "'  Sequence='"+((i+1)*10)+"' LabelText='" +Name +"' />" 
        }
    }
    programsRibbonXml +="</Controls></MenuSection>";
    commandProperties["PopulationXML"] = '<Menu Id="msd.Lead.Programs.Menu">' + programsRibbonXml + "</Menu>";
}
function programClicked(commandProperties) {
 alert ("program with id "+commandProperties.SourceControlId +" selected.");
}

Finally, the dynamic menu buttons will be shown in both Web client & Unified Interface.


















Hope it will help!

Retrieve Multiple through fetch XML using Web API


Following is a detail sample code to retrieve multiple records using fetchXml query using Web API in Dynamics CRM.
/*
entityPlurarName: entityPlurarName is the plural entity logical name of entity e.g for account it is accounts. for opportunity it is opportunities
fetchXml: fetchXml
return:- entity collections object      
*/
 function executeFetchXml(entityPlurarName, fetchXml) {
    var data = null;
    var req = new XMLHttpRequest();
    req.open('GET', Xrm.Page.context.getClientUrl() + "/api/data/v8.1/" + entityPlurarName + "?fetchXml=" + encodeURIComponent(fetchXml), false);
    req.setRequestHeader("Accept", "application/json");
    req.setRequestHeader("Content-type", "application/json; charset=utf-8");
    req.setRequestHeader("OData-MaxVersion", "4.0");
    req.setRequestHeader("OData-Version", "4.0");
    req.send();
    if (req.readyState === 4) {
        if (req.status === 200) {
            data = JSON.parse(req.response);
        }
        else {
            var error = JSON.parse(req.response).error;
            console.log(error.message);
        }
    }
    return data;
}
You can call the executeFetchXml method as:
 var fetchXml = " <fetch version='1.0' output-format='xml-platform' mapping='logical' distinct='false'>" +
                " <entity name='account'>" +
                " <attribute name='name' />" +
                " <attribute name='primarycontactid' />" +
                " <attribute name='telephone1' />" +
                " <attribute name='accountid' />" +
                " <order attribute='name' descending='false' />" +
                " <filter type='and'>" +
                " <condition attribute='modifiedon' operator='last-seven-days' />" +
                " </filter>" +
                " </entity>" +
                " </fetch>";
    var data = executeFetchXml('accounts', fetchXml);
    if (data !== null && data.value.length > 0) {
        console.log("Account Name :" + data.value[0].name);
        //you code here
    }


Retrieve Multiple using Web API

Following is a detail sample code to retrieve a record using Web API in Dynamics CRM.
/*
entityName: entityName is the plural entity logical name of entity e.g for account it is accounts. for opportunity it is opportunities
query: the odata query
return:-Entity records       
*/
function retrieveMultiple(entityName , query) {
    var data = null;
    var req = new XMLHttpRequest();
    req.open('GET', Xrm.Page.context.getClientUrl() + "/api/data/v8.2/" + entityPlurarName + query, false);
    req.setRequestHeader("Accept", "application/json");
    req.setRequestHeader("Content-type", "application/json; charset=utf-8");
    req.setRequestHeader("OData-MaxVersion", "4.0");
    req.setRequestHeader("OData-Version", "4.0");
    req.send();
    if (req.readyState == 4) {
        if (req.status == 200) {
            data = JSON.parse(req.response);
        }
        else {
            var error = JSON.parse(req.response).error;
            console.log(error.message);
        }
    }
    return data
}
You can call the above retrieveMultiple method as:
var data = retrieveMultiple('roles', "?$select=roleid&$filter=name eq 'Project Manager'");
    if (data != null && data.value.length > 0)
    {
        var PMRoleID= data.value[0].roleid;
    }