HowTo: HTML/JS WebResources

http://butenko.pro/2015/03/howto-htmljs-webresources/

We (developers) have a great feature in CRM 2011 release. If you want to give your CRM application new client side features or controls not available OOB and you want your solution to remain supported, you have to use HTML/JS webresources. This article describes some approaches, tricks and code snippets I found or developed while using HTML/JS webresources.

Embedding and passing parameters
To pass context of execution (entity and identifier or a record) or some custom parameters, you first have to define it in webresource configuration:

To parse and use the parameters in your webresource, you can use the following code:

1	var parameters = GetGlobalContext().getQueryStringParameters();

Important Note: To make GetGlobalContext method available, you have to reference ClientGlobalContext.js.aspx in your code:

1	<script type="text/javascript" src="../ClientGlobalContext.js.aspx"></script>

And here is one way passed parameters could be used:

To get the identifier or type of a record you can use the following code:

1 2	var recordid = parameters.id; var entityname = parameters.typename;

Obviously, if parameters.id equals null that means that user creates a record or you haven’t checked the ‘Pass record object-type code and unique identifier as parameters’ checkbox. So if you are sure that you have checked the checkbox and that the id is null, the webresource wil be executed in a context of create form.

If you added a custom parameter or parameters, you can access it using the following code:

1	var customparams = parameters.data;

If you use multiple parameters and you use the format “Parameter1=Value1&Parameter2=Value2”, the following code could help you in the parsing of parameters passed:

1 2 3 4 5 6 7 8 9 10 11 12 13 14

function ParseData(query) {     var result = {};       if (typeof query == "undefined" || query == null) {         return result;     }       var queryparts = query.split("&");     for (var i = 0; i < queryparts.length; i++) {         var params = queryparts[i].split("=");         result[params[0]] = params.length > 1 ? params[1] : null;     }     return result; }

and here is usage of mentioned method:

1 2 3

var customparams = ParseData(parameters.data); var customparam1 = customparams.CustomParam1; var customparam2 = customparams.CustomParam2;

UPD: Today, I got a brilliant suggestion from my friend and MVP Artem Grunin – try to use JSON format when you pass custom parameters. I tried it and here are the results I got:

Registration of custom parameters:

And usage in webresource code:

As you can see – that work perfectly!

Communication with caller window

If you need to communicate with caller window, you can use following code to get the “Xrm” object:

1	var Xrm = window.parent.Xrm;

and then access  everything normally available with JavaScript code for the CRM form. Below is an example of accessing the field value:

1	var windownamefieldvalue = Xrm.Page.getAttribute("new_name").getValue();

Subscription to fields and form events

Sometimes you need to react on some events raised in CRM form like OnChange of field or OnSave of form. You can do it using the following code for OnChange:

1 2 3 4

var Xrm = window.parent.Xrm; Xrm.Page.getAttribute("new_name").addOnChange(function (context) {     alert("Field Was Changed"); });

The “context” parameter of a method can be used to get information about call context. Here is a short piece of code that demonstrates how the parameter can be used:

1 2 3 4 5 6 7

var Xrm = window.parent.Xrm; Xrm.Page.getAttribute("new_name").addOnChange(function (context) {     var originAttribute = context.getEventSource();//Attribute that was changed on a form.     var callDepth = context.getDepth();//get depth of a call.       alert("Attribute " + originAttribute.getName() + " was changed and depth of a call is " + callDepth); });

If you need to handle OnSave event, you can use the following code:

1 2 3 4

var Xrm = window.parent.Xrm; Xrm.Page.data.entity.addOnSave(function (context) {     alert("Form was saved"); });

The “context” parameter is a standard execution context for the Save event used in standard CRM forms. You can use it to analyze Save mode or to cancel Save:

1 2 3 4 5 6 7

var Xrm = window.parent.Xrm; Xrm.Page.data.entity.addOnSave(function (context) {     alert("Form was saved and Save mode is - " + context.getEventArgs().getSaveMode());       context.getEventArgs().preventDefault();     alert("Save was cancelled"); });

Tricks

Fixing the behavior of webresources for which the execution of logic for Create and Update forms differs (special thanks to Inogic for the idea, origin – http://inogic.com/blog/2014/08/update-html-on-form-save-button/)

Let’s assume that you have developed webresources for which the execution logic is different for the Create and Update form. You have opened a new form and, in this case, webresources worked properly (followed ‘Create Form’ logic). You clicked Save and expected that webresource would be reloaded and ‘Update Form’ logic would work. Unfortunately not. CRM doesn’t reload webresources in such scenarios. Add the following code to CRM Form Onload handler to help CRM reload webresource:

1 2 3 4 5 6 7 8 9 10 11 12

var wrid = "Put your webresource control here";   var currenturl = Xrm.Page.getControl(wrid).getSrc();   if (currenturl.toLowerCase() == "/_static/blank.htm") {     currenturl = Xrm.Page.getControl(wrid).getInitialUrl(); }   if (currenturl.toLowerCase().indexOf("id=", currenturl.length() - 3) != -1) {     currenturl += Xrm.Page.data.entity.getId();     Xrm.Page.getControl(wrid).setSrc(currenturl); }

Restore of standard events (special thanks to Spectr, origin – http://axforum.info/forums/showthread.php?p=301306#post301306)

If you have referenced ClientGlobalContext.js.aspx you should be aware that this would cancel the onselectstart, contextmenu, and ondragstart events. If you want to restore those handlers, you can use following code during the onload of webresources:

1 2 3 4 5 6 7

if (document &&     document._events &&     document._events.unload &&     document._events.unload[0] &&     document._events.unload[0].handler) {     document._events.unload[0].handler(); }

General Conclusions

1. Try to use supported approaches. Otherwise, your code could stop working after installing the Updates

2. If you want to build complex and beautiful extensions, start learning (if you haven’t yet done it) JavaScript Frameworks. Here is what I use at the moment:

• jQuery (for easier work with DOM)
• Knockout.js (for complex binding scenarios)

Loop through Section and Page in CRM 2015

var requiredAttributeNames =[];

    XrmPage.ui.tabs.get("CL_Configurations").sections.get("CL_Configurations").controls.get(

    function (ctrl, i) {

      

        var ctrlname = ctrl.getName();

        requiredAttributeNames.push(ctrlname);

      

           

    });

    var preferredmethodofcontacttypes = requiredAttributeNames.indexOf("gw_preferredmethodofcontacttypes");

   // alert(preferredmethodofcontacttypes);

    var taskorigintypes = requiredAttributeNames.indexOf("gw_taskorigintypes");

    //alert(taskorigintypes);

   var relationtypes = requiredAttributeNames.indexOf("gw_relationshiptypes");

loop through page 

Xrm.Page.ui.controls.get(
function(ctrl,i){
 if(ctrl.getControlType() == "subgrid")
  console.log(ctrl.getName()
  );
});

Reference -  

https://msdn.microsoft.com/en-us/library/gg328261.aspx

https://msdn.microsoft.com/en-us/library/jj602964.aspx

Quick find on Selected View

Overview

Reference - 

https://blogs.msdn.microsoft.com/crminthefield/2014/09/11/codeplex-dynamics-crm-quickfind-on-selected-view/

“QuickFind doesn’t respect current view? I hear you!”

Thank you for your recent feedback regarding QuickFind functionality in CRM. The QuickFind search functionality (in its current form) does not return records from within the selected view. Instead, it spans its search across all active records within the selected entity. I have therefore written the following project as my answer to this problem.

Project Description Dynamics CRM solution : Do QuickFind search for selected view.

The purpose of this project is to distribute the QuickFind on Selected View solution and source code to the customer/partner community. I have developed this solution in response to the requests from customers and partners who wanted QuickFind to search under currently selected view. I have used Custom Entity and Plug-in to achieve some scenario but the requirement will vary from project to project, so I publishing this as an open source so that you can decide how to use it in your respective project.

Limitations

There are several known limitations.

– If you do QuickFind right after using Advanced Find, QuickFind may query by using Advanced Find query as that could be last used query. The Plug-in cannot distinguish between View query to Advanced Find query. 
– Same limitation applies If you do QuickFind right after you see Related Entity Grid for a record in separate window, QuickFind may query by using Related Entity Grid view 
– If you use Multi-Entity Search on Microsoft Dynamics CRM Table client, the search result may be affected by this solution, as it uses QuickFind feature to search the result.

Workaround

– If you think query results are not correct, refresh the view once more, which ensure the selected view definition is stored in last executed query. 

Solution Detail

This solution consists of 3 components.

Custom Entity : Query History
The custom entity stored “Last Executed Query” information. Please note it is not “Last Used View” information.
It has 2 custom fields.

– Entity Name : (1 line text, Length 100) – Stores which entity for the query
– FetchXML : (Multiline text, Length 10,000) – Stores last used FetchXml. (QueryExpression will be converted to FetchXML to store)

Plug-in
Plug-in monitor and investigate query passed to RetrieveMultiple, and decide what to do depending on the query. Please see source code for more detail.
If you want to register more steps, please use the Plugin Registration Tool and register a step as following.

– Register against RetrieveMultiple request (Please do not register against Execute)
– Specify the Entity that you want QuickFind query based on last executed query (Please do not leave primary Entity blank as that affect all entities)
– Specify Calling User to Run in User’s Context
– Register to Pre-Operation stage with Synchronous

Security Role
Simple security role which has User level Create/Read/Write privilege to the custom entity.

Important Notes

Please do not use this in ProductionPlease consider this as just a sample to demonstrate how to achieve the scenario. As scenario and situation varies depending on each environment, please investigate the code and modify accordingly to meet your requirements.
In addition, please implement error handling which suits your system.

Signing Key
Provided sample Visual Studio solution includes self signed certificate with no password. When you do so, please do not forget to update the entity and the field names in the plug-in code.

Managed Solution
I strongly recommend you to create your own solution which includes necessary custom entity with custom field. When you do so, do not forget update entity and field names in plug-in code.