Embedding iFrame in Dynamics CRM

Reply
Yellow Belt

Embedding iFrame in Dynamics CRM

I am trying to Embed a Domo card into our Dynamics CRM and getting the URL to read the right identifier to then filter the card down to the right records is proving difficult. 

 

I've referred to this discussion: https://dojo.domo.com/t5/Card-Building/Filter-Page-via-URL/td-p/23967

and this discussion: https://dojo.domo.com/t5/Domo-Everywhere-Embed/Embedded-Cards-in-Salesforce-Dynamic-Filter/m-p/26993...

and they've helped me to see the card in Dynamics, but it's not filtering the card to the records associated with the contact I'm viewing.

 

Here's my syntax so far: https://XXXXX.domo.com/embed/view/71400645?pfilters=[{"dataSetId":"xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxx...", "column": "client_ContactId", "dataType": "string" , "operand":"IN", "values":"id"}]

 

The values that CRM would pass to DOMO are not being picked up properly because it's showing me all values rather than those associated.  There's a setting within the Dynamics iFrame where it says "Pass record object-type code and unique identifier as parameters." that I have checked (see graphic), but how do I have domo pick up the unigue identifier to then filter the card/page?  Do I need to build the card/page in a special way to have it picked up?  I feel like the values part of my URL needs some attention, but I'm unsure as to how to change it.

DynamicsiFrame.PNG

The ideal end result is to have a page instead of the card where I show a lot of different types of stats and have that as an iFrame in Dynamics and have it filtered to just the record I'm viewing, but for now I'll settle for the card to work as intended.


Accepted Solutions
Yellow Belt

Aaron,

What I did was built a Web Resource and had our developer write me a little HTML javascript to get it done. Here's the HTML:

<html><head>
<meta><meta></head>

<body style="overflow-wrap: break-word;">
  <title>DOMO CRM</title>

  <style type="text/css">
    .embed-container {
      height: 0;
      margin: 20px auto;
      max-width: 100%;
      overflow: hidden;
      padding-bottom: 56.25%;
      position: relative;
    }

    .embed-container iframe {
      height: 100%;
      left: 0;
      position: absolute;
      top: 0;
      width: 100%;
    }
  </style>

  <div id="output" class="embed-container">
    
</div>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>

  <script type="text/javascript">
    $(document).ready(function() {
      var ujcrmd = '';
      
	  // Test ID
      // var id = "B66C8E96-9049-44BA-AA07-56D1AE14804E";
      
      // Get parent ID (from parent window)
      var id = window.parent.Xrm.Page.data.entity.getId();
      
	  // Set id2 to id minus the curly braces and then make the characters lowercase
      var id2 = id.replace(/{|}/g, '').toLowerCase();
      
	  // Declare the pfilters with the dynamic sanitized id
	  //datasetid is the dataset from DOMO
	  //client_ContactId is the field within your domo card that contains the ID from the record you want to view
	  //id2 is the id from dynamics that should be passed to the filter in DOMO to display the record you want
      var ds = '[{"dataSetId":"fbbb7d08-4644-4bde-bc58-9c1067fea6a3", "column": "client_ContactId", "dataType": "string" , "operand":"IN", "values":["' + id2 + '"]}]';
      
	  // URI encode the pfilters
      var dse = encodeURI(ds);
      
	  // Create the iframe with the new URL
      ujcrmd += '<iframe frameborder="0" height="300" width="300" src="https://yourdomain.domo.com:443/embed/view/71400645?pfilters=' + dse + '"></iframe>';
      
	  // Inject into #output div
      document.getElementById("output").innerHTML = ujcrmd;
    });
  </script>


</body></html>

View solution in original post


All Replies
Major Brown Belt

Hey user05315!

I would recommend checking Domo's documentation on Embedding functionality here as your first step:

 

https://knowledge.domo.com?cid=domoembed

 

However, I'm not finding an answer to your direct question on my side. It may be more beneficial to reach out to your Domo account team for added support on this feature, and to let you know what can be accomplished here.

 

Thanks!

 

- Jarvis

Yellow Belt

Thank Jarvis, I originally tried what the link you referenced showed, but it wouldn't dynamically change the results in the card.  I've since talked with one of our web developers and he was able to get me some javascript that builds the URL dynamically within our CRM web resource and then displays the results in our iframe.  It works, but not as easy as some have said it is in Salesforce.

Black Belt
Black Belt

Hi @JaredUJZ

We're looking to do exactly the same thing in our Dynamics environment you've done in yours. Would you be willing to share what your web developer put together for you (less any sensitive information, naturally)?

Aaron
MajorDomo @ Merit Medical

**Say "Thanks" by clicking the heart in the post that helped you.
**Please mark the post that solves your problem by clicking on "Accept as Solution"
Yellow Belt

Aaron,

What I did was built a Web Resource and had our developer write me a little HTML javascript to get it done. Here's the HTML:

<html><head>
<meta><meta></head>

<body style="overflow-wrap: break-word;">
  <title>DOMO CRM</title>

  <style type="text/css">
    .embed-container {
      height: 0;
      margin: 20px auto;
      max-width: 100%;
      overflow: hidden;
      padding-bottom: 56.25%;
      position: relative;
    }

    .embed-container iframe {
      height: 100%;
      left: 0;
      position: absolute;
      top: 0;
      width: 100%;
    }
  </style>

  <div id="output" class="embed-container">
    
</div>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>

  <script type="text/javascript">
    $(document).ready(function() {
      var ujcrmd = '';
      
	  // Test ID
      // var id = "B66C8E96-9049-44BA-AA07-56D1AE14804E";
      
      // Get parent ID (from parent window)
      var id = window.parent.Xrm.Page.data.entity.getId();
      
	  // Set id2 to id minus the curly braces and then make the characters lowercase
      var id2 = id.replace(/{|}/g, '').toLowerCase();
      
	  // Declare the pfilters with the dynamic sanitized id
	  //datasetid is the dataset from DOMO
	  //client_ContactId is the field within your domo card that contains the ID from the record you want to view
	  //id2 is the id from dynamics that should be passed to the filter in DOMO to display the record you want
      var ds = '[{"dataSetId":"fbbb7d08-4644-4bde-bc58-9c1067fea6a3", "column": "client_ContactId", "dataType": "string" , "operand":"IN", "values":["' + id2 + '"]}]';
      
	  // URI encode the pfilters
      var dse = encodeURI(ds);
      
	  // Create the iframe with the new URL
      ujcrmd += '<iframe frameborder="0" height="300" width="300" src="https://yourdomain.domo.com:443/embed/view/71400645?pfilters=' + dse + '"></iframe>';
      
	  // Inject into #output div
      document.getElementById("output").innerHTML = ujcrmd;
    });
  </script>


</body></html>

View solution in original post

Black Belt
Black Belt

Perfect!  

Yes, I'm sure this will be so helpful.  I'll reach out if I have more questions.

I owe you lunch!

Aaron
MajorDomo @ Merit Medical

**Say "Thanks" by clicking the heart in the post that helped you.
**Please mark the post that solves your problem by clicking on "Accept as Solution"
Announcements
New & Improved Dojo: Get excited for a new feel and additional features in the online community.

Site will be down February 4-5th for maintenance.

Launch coming February 8th!