Including Custom JavaScript Files & Adding Events on Fly in MSCRM 3.0
Including custom JavaScript files in MSCRM 3.0
While working with MS CRM, you will find a lot of client-side coding in JavaScript. MS CRM has exposed onLoad, onSave & onChanged event. Once you add javascript, you could save the form followed by publishing it. The whole process is time-consuming and again publishing entity calls for resetting IIS, which it may not be permissible.
In a development scenario, we always use common methods, which are placed in common files. In most programming languages, there is a concept of “INCLUDE files”. Includes files are referenced at the start of your program & Interpreter or the Compiler will add that to your program.
I.e. Includes files are easy to maintain /modify.
How can we use it in MS CRM?
Say we need to calculate total amount in the below example, i.e. Add Freight amt and Total Tax.
Create the .js file:
Open Notepad and copy the following Javascript into it
function CalculateTotal()
{
crmForm.all.TotalAmout.DataValue = crmForm.all.TotalTax.DataValue + crmForm.all.FreightAmount.DataValue
}
{
crmForm.all.TotalAmout.DataValue = crmForm.all.TotalTax.DataValue + crmForm.all.FreightAmount.DataValue
}
Save this file as CommonFunction.js and place it in a directory below your MSCRM web directory called myscripts.
Reference your .js file:
In the OnLoad event of your Form, include the following code:
var script = document.createElement(’script’);
script.language = ‘javascript’;
script.src = ‘/myscripts/CommonFunction.js’;
document.getElementsByTagName(’head’)[0].appendChild(script);
script.language = ‘javascript’;
script.src = ‘/myscripts/CommonFunction.js’;
document.getElementsByTagName(’head’)[0].appendChild(script);
Now you can call CalculateTotal () wherever you want;
Using Included Functions in the Form OnLoad Event:
It is possible to run into a timing issue because the include file has not yet finished appending to the CRM Form. This is really only a problem if you need to access a function from your include file from within the OnLoad event.
To work around with this issue, we need to wait for the script’s state to change to “loaded” before any functions in the include file can be accessed:??
var script = document.createElement(’script’);
script.language = ‘javascript’;
script.src = ‘/myscripts/CommonFunction.js’;
document.getElementsByTagName(’head’)[0].appendChild(script);
script.language = ‘javascript’;
script.src = ‘/myscripts/CommonFunction.js’;
document.getElementsByTagName(’head’)[0].appendChild(script);
var f = function()
{
if (event.srcElement.readyState == “loaded”)
CalculateTotal() // some function from MyFunctions.js
}
{
if (event.srcElement.readyState == “loaded”)
CalculateTotal() // some function from MyFunctions.js
}
script.attachEvent(”onreadystatechange”, f);
Points To Ponder:
This solution will not work if you have the CRM 3.0 Outlook Laptop Client deployed. This is because the Laptop client utilizes a local Web server and if physically disconnected from the main CRM web server, the JavaScript file will be unavailable and a script error on the page will result.
Few more javascript.
Adding events on the fly.
In Javascript, there are quite a few events for each field. Unfortunately, MS CRM only exposed onchange event of a field.
No problem with few lines of code you can attached event on the fly. The only place where you can add your code is onLoad() event of the entity and here is the way to do it:
crmForm.all.fieldname.eventname = function() {
//event handling code goes here
}
//event handling code goes here
}
A commonly used event is onclick. Surpisingly it fires whenever you click the field:
crmForm.all.fieldname.onclick = function() {
alert(“fieldname clicked!”);
}
alert(“fieldname clicked!”);
}
Accordingly, we can use more events as we require.