Open webresources Modal or Inline using Xrm.Naviagtion.naviagteTo in Dynamics 365 Unified interface

Release wave 2 have released some wonderful features and one of them is the capability to open a webresource as modal or inline. I bet this is going to ease the life of lot of consultants who were traditionally using Xrm.Navigation.openWebResource or Xrm.Utility.openWebResource (deprecated) to open webresource and hear about the perennial client complaint of why it is not modal.

Introducing to you, the newest star on the rise – Xrm.Navigation.navigateTo

So let’s see how we can open the webresource as modal. Detailed documentation can be found here – https://docs.microsoft.com/en-us/powerapps/developer/model-driven-apps/clientapi/reference/xrm-navigation/navigateto

Sample code below.

var qs = "param1=1&param2=2"; 
var pageInput = { 
    pageType: "webresource", 
    webresourceName: "trng_/pages/newapitest.html", 
    data: encodeURIComponent(qs) 
}; 
var navigationOptions = { 
    target: 2, // 2 is for opening the page as a dialog. 
    width: 400, // default is px. can be specified in % as well. 
    height: 300, // default is px. can be specified in % as well. 
    position: 1 // Specify 1 to open the dialog in center; 2 to open the dialog on the side. Default is 1 (center). 
}; 
Xrm.Navigation.navigateTo(pageInput, navigationOptions).then( 
    function success() { 
        debugger; 
    }, 
    function error(e) { 
        // Handle errors 
    } 
);

 

And there you go. I have opened up the same webresource on click of a ribbon button. Honestly have waited long for this one. Certainly a smile on customer’s face.

image

Well you can even resize it to occupy full screen using the resize option as highlighted inside Orange rectangle. Also you can pass custom parameters as data like I did in my code.

So far so good but as a consultant don’t get carried away by this new feature as you may need to update your customer upfront on some important aspects.

  • Users need to close the dialog using the “X” button available on the dialog. There is no API available as of the time of writing this blog where we can close the dialog using a custom button. The user have the use the default close dialog option only.
  • No data is passed to the callback method. So don’t expect some data from the dialog being passed to the successcallback method

Even better if you want to open your webresource on the side pane, just like Quick create form opens, all you need to do is change “position” value of navigationOptions parameter to 2. And below is how it looks.

image

And finally don’t forget to include a reference to clientglobalcontext.js.aspx  if you want to get hold of the Xrm namespace methods inside it, just like the old ways.

Hope this helps!

Debajit Dutta

(Dynamics MVP)

For consultation/ corporate training visit www.xrmforyou.com or reach out to us at info@xrmforyou.com

Our product offerings:

Role based views for Dynamics 365 (http://www.xrmforyou.com/role-based-views.html)

CRM-Sharepoint Attachment uploader and metadata manager (http://www.xrmforyou.com/sharepoint-integrator.html)

Record Cloner for Dynamics 365 (http://www.xrmforyou.com/record-cloner.html)

Author: Debajit

I am a Dynamics CRM Most Valuable Professional (MVP) with 12 years of experience in Microsoft .NET Technologies and 9 years of dedicated experience in Microsoft Dynamics CRM. I have worked with companies like Microsoft, SanDisk, PwC, TMF Group and have extensive experience of implementing complex CRM solutions from both offshore and client side. Currently the face of XrmForYou.com with significant experience in delivering corporate training on Dynamics CRM and have already delivered multiple projects to client through XrmForYou.com Author of multiple tools on codeplex including the 'Role Based Views' and 'CRM-Sharepoint Metadata manager & Attachment Extractor' which are available for commercial use under XrmForYou.com For consulting/ training, drop me a note at info@xrmforyou.com or visit our website www.xrmforyou.com

One thought on “Open webresources Modal or Inline using Xrm.Naviagtion.naviagteTo in Dynamics 365 Unified interface

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s