Microsoft Release 2020: Open dialog on button click

Today, we will see how to open an entity main form on top on another entity main form without navigating from one entity to another.

Let’s take an example of Order and Product entity. So, when a user clicks on Order entity main form ribbon button then Product entity main form dialog should get pop up above Order entity main form instead of navigating to Product entity.

Steps to achieve the above functionality:

  • Get the Ribbon Workbench solution installed on the CRM instance.
  • Create a new solution and add Order entity.
  • Create a new web-resource of JavaScript type and add the below JS code in it.
  • Add the web-resource in the solution.
function DialogPopUp()
{
Xrm.Navigation.navigateTo(
{
pageType: "entityrecord",
entityName: "product",
formType: 2
},
{
target: 2,
position: 1,
width: {
value: 70,
unit: "%"
}
});
}

Now, lets open the solution inside ribbon workbench.
Click on Open Solution button on the left top this with pop up a window. Using which we get the ability to select the desired solution which we want to open inside ribbon workbench.

Figure 1: Ribbon Workbench

Drag the Button option from ToolBox menu and place it on the Order form ribbon. Rename the button by inserting a new name in the Label. I have given Product Dialog – the same would get reflected on the Order main form.

Figure 2: Create button on Order entity

Now create a new command by clicking on the “+” icon. This is where we call the JavaScript webresource as shown in the below image and provide the JS function name(DialogPopUp) inside the Function Name field.

Figure 3: Create a new command for calling JS webresource

Enable the Display Rule to True. For this click in the “+” icon next to Display Rule and

Figure 4: Enable Display Rule

Select the button rule as shown in the below image and tag the command inside Command drop-down.

Figure 5: Tag command inside Command drop-down

Now, we need to save our changes therefore hit the Publish button. Post that go back to Order entity and refresh the browser.

Figure 6: Product Dialog button on Order entity.

Hit the Product Dialog button and we should get the Product entity main form on top of SalesOrder entity.

Figure 7: Product Dialog on SalesOrder Entity

Happy CRM!

Microsoft Release 2020: Open Dialog on Lookup field click

Normally, we have observed that whenever a user clicks on any lookup field value. Then the CRM navigates the user to the lookup entity record page.

Today’s we will learn how to stop user from navigating from one page to another page on click of lookup field value. This will help users to have a good experience while using CRM product and increase their productivity on their day to day activity on CRM.
This, will actually reduce the number of click which users makes while navigating from one entity to another entity main form and coming bank again to the main form page.

Let’s take an example of Account entity, when a user go to account entity they may have multiple lookup fields on the Account Main form. Clicking on the lookup field value user gets redirected to the lookup associated entity record. Today’s blog is related to the same scenario where when a user clicks on lookup field value, a dialog should open on the same main form instead navigating the user to another entity main form.

Steps to implement the Lookup dialog functionality and let’s take an example of Account entity.

  • Create a new Javascript web resource.
  • Add the web resource under Account Form libraries.
  • Then call the web resource function (LookupDialog) on the Account entity Form: OnLoad event.
  • Publish the changes.

Below is the code which you can use for achieving lookup dialog functionality. I have made it generic so that the same code can be used for any entity main form OnLoad event.

This feature is achievable with the help of OnLookupTagClick Event.

//Call function onload of form with execution context passed.
function LookupDialog(executionContext)
{
var formContext = executionContext.getFormContext();
//Get all attributes on form on event.
formContext.data.entity.attributes.forEach(function (attribute, index)
{
//For each attribute check whether the attribute type is "lookup" or not.
var attributeType = attribute.getAttributeType();
if(attributeType=="lookup"){
var attrName=attribute.getName();
//If attribute is of lookup type, add OnLookupTagClick event to field
OpenLookupDialog(formContext,attrName);
}
});
}

function OpenLookupDialog(formContext,lookupField)
{
formContext.getControl(lookupField).addOnLookupTagClick(context => {
context.getEventArgs().preventDefault();
const lookupTagValue = context.getEventArgs().getTagValue();
Xrm.Navigation.navigateTo(
{
pageType: "entityrecord",
entityName: lookupTagValue.entityType,
formType: 2,
entityId: lookupTagValue.id
},
{
target: 2,
position: 1,
width: {
value: 70,
unit: "%"
}
});
});
}
Figure 1: Adding Web resource on entity OnLoad event

Post publish –> Go back to the Account entity UCI form and refresh the page.

Figure 2: User click on Primary Contact which is a lookup field.
Figure 3: Contact main form opened on top of Account form.

Now, we have managed to stop the CRM from redirecting us to the lookup record page. Indeed we get the dialog on top of the page we were residing.

We also get the ability to maximize the dialog width to full screen. The option appear in the above picture under the green box. Once the dialog is maximized to to full screen we will still have the “X” icon on the screen. It will allow us to come back directly to the Account main form.

Note: This feature would work only on the UCI form not on Classic form.

Happy CRM! 😊

Design a site like this with WordPress.com
Get started