Client Side Scripting - More JavaScript Code Part 1 (STUNNWARE)

STUNNWARE

---

I noticed that the articles dealing with JavaScript code are your favorite topics, so I decided to have a look at all of my posts in the Microsoft CRM newsgroups dealing with JavaScript samples. I found quite a lot of them, so instead of repeating some common solutions over an over, I'm including them on this page for easy access. Hope you find it helpful.

Replacing the content of an IFRAME

If you really want to do some funny things in your CRM form, you can create an IFRAME serving as a placeholder for your real HTML code. Create an IFRAME in an entity and name it "IFRAME_TEST". In the Onload event put the following code:

crmForm.all.IFRAME_TEST_d.innerHTML ="<b>Some HTML text</b>";

Note the "_d" at the end of IFRAME_TEST. This single line replaces the whole IFRAME element with your own HTML.

Adding additional values to duration fields

The following script adds the new option "42 Minutes" to the actualdurationminutes field in a task:

var duration = crmForm.all.actualdurationminutesSelect;

var tables = duration.getElementsByTagName("table");
var table = tables[1];

var row = table.insertRow();
var newOption = row.insertCell(-1);

var newValue = "42 Minutes";
newOption.setAttribute("val", newValue);
newOption.innerText = newValue;

Changing the title of a CRM form

document.title = "Hello World!";

Changing the Link of a Ticker Symbol from MSN Money to Yahoo Finances

This is an unsupported solution as it requires modifications to server files!

Open the following directory on your CRM server: C:\Inetpub\wwwroot\_forms\controls (may vary depending on your installation)
Open the following file: INPUT.text.ticker.htc

Search the following function:

function Launch()
{
    if(value.length > 0)
    {
        Parse();

        window.open("http://go.microsoft.com/fwlink?linkid=8506&Symbol=" +
encodeURIComponent(value), "", "height=" + (screen.availHeight * .75) +
",width=" + (screen.availWidth * .75) +
,scrollbars=1,resizable=1,status=1,toolbar=1,menubar=1,location=1");
    }
}

Replace it with the following:

function Launch()
{
    if(value.length > 0)
    {
        Parse();

        //window.open("http://go.microsoft.com/fwlink?linkid=8506&Symbol=" +
encodeURIComponent(value), "", "height=" + (screen.availHeight * .75) +
",width=" + (screen.availWidth * .75) +
,scrollbars=1,resizable=1,status=1,toolbar=1,menubar=1,location=1");
        window.open("http://finance.yahoo.com/q?s=" +
encodeURIComponent(value), "", "height=" + (screen.availHeight * .75) +
",width=" + (screen.availWidth * .75) +
",scrollbars=1,resizable=1,status=1,toolbar=1,menubar=1,location=1");
    }
}

Save the file.

On your client machine: Open Internet Explorer and remove all temporary internet files, so that the new htc source is retrieved. Navigate to any ticker symbol, enter a valid value and double click it.

Counting the number of backslashes in a string

Of course you can use the two code snippets with any character you like.

Solution 1

var text = "hardware\\printers\\Epson";
var paths = text.split("\\");
alert(paths.length -1);

Solution 2)

var text = "hardware\\printers\\Epson";
var numBs = 0;
var index = 0;

while(index != -1) {
 index = text.indexOf("\\", index);

 if (index != -1) {
  numBs++;
  index++;
 }
}

alert(numBs);

Changing the label of a field at runtime

Lets say you want to change the label of the revenue field, then you simply write

crmForm.all.revenue_c.innerText = "Amount Euro";

Simply append the "_c" to the field name. This should work for most labels.

Changing the color of a single option in a picklist

You can change the color and background color of an option element using the following syntax:

//TODO: Replace <name of your picklist field> with the schema name of the picklist in question.
var list = crmForm.all.<name of your picklist field>;

//using the first option here, you need to find the one you need.
var option = list.options[0];

//Set the background color to red.
option.style.backgroundColor = "#FF0000";

//Set the text color to white.
option.style.color = "#FFFFFF";

Opening a new window without the IE menu and status bars

The following is a sample HTML page that you can use to test. Replace the link with the URL of your web page.

<html>
<head/>
<body>
<p>
<a href="javascript:;"
onClick="window.open('http://www.stunnware.com/crm','stunnware','toolbar=no,status=no,menubar=no,scrollbars=yes,resizable=yes');
return false">Stunnware</a>
</p>
</body>
</html>

Retrieving the text of a lookup control

var lookup = crmForm.all.<lookupfield>.DataValue;

if (lookup[0] != null) {
    var theText = lookup[0].name;
}

Disabling a form at runtime

document.body.disabled = true;

This will disable all controls except the Notes tab, where you still can
enter new notes.

Automatically changing the value of a text field to capitals

Put the following script in the OnChange event of the text field:

crmForm.all.<name of text field>.DataValue = crmForm.all.<name of text field>.DataValue.toUpperCase();

Getting notified when the user selects a another tab on a form

Put the following in the OnLoad event of your form:

crmForm.all.tab0Tab.onclick = function() {
    alert("Tab 0 clicked");
}

crmForm.all.tab1Tab.onclick = function() {
    alert("Tab 1 clicked");
}

It seems that the tab pages are always named "tabxTab", where x is a number starting from 0 (first tab) to (n-1), where n is the total number of tabs. Maybe you find better events that handle the activation instead of a click, but that's the general way it should work.

The current record id

The primary key is always available in

crmForm.ObjectId

It is set to null, if the record hasn't been saved yet. There are some other useful properties. Look at the "Form Object Model" in the SDK docs for more information.

The current object type code

The type code of the entity being displayed in a CRM form is available through

crmForm.ObjectTypeCode

There are some other useful properties. Look at the "Form Object Model" in the SDK docs for more information.

Initializing a date field with the current date

crmForm.all.<attribute>.DataValue = new Date();

Changing the URL of an IFRAME at runtime

Set the initial URL of the IFRAME to about:blank and execute the following line:

document.all.IFRAME_<name of iframe>.src = "http://domain/file";

Displaying a picture in a CRM form, using a text field to store the data source

Let's say you have a custom field storing the image name called new_pictureName. Then in
the OnLoad event do the following:

if ((crmForm.all.new_pictureName != null) && (crmForm.all.new_pictureName.DataValue != null)) {
    document.all.IFRAME_<name of iframe>.src = http://server/dir/images/ +  crmForm.all.new_pictureName.DataValue;
}

In the OnChange event of the new_pictureName place the following:

if (crmForm.all.new_pictureName.DataValue != null) {
    document.all.IFRAME_<name of iframe>.src = http://server/dir/images/ +
crmForm.all.new_pictureName.DataValue;
}

else {
    document.all.IFRAME_<name of iframe>.src = "about:blank"
}

Checking crmForm.all.new_pictureName for null in the OnLoad event is a sanity check. Bulk edit forms will not display all fields and if it is not contained in the form, it will be null. This check is not required in the OnChange event, as this event will never fire if the field does not exist.

Changing the default lookup type

When opening a lookup that can select from multiple entity types, you may want to use a different default entity in the lookup dialog. The following script changes the default entity of the regardingobjectid field in an activity to contacts:

if (crmForm.all.regardingobjectid != null) {
    crmForm.all.regardingobjectid.setAttribute("defaulttype", "2");
}

Checking if a field is present in a form

if (crmForm.all.<name of field> != null) {
    //do your JavaScript processing here
}

You should always check if a field is present before accessing it, because your script may throw an exception if it is not included in a form (like in quick create forms if your field is not required or recommended).

Calculating a date field based upon the selection of a picklist

The following script assumes that you have a picklist with three values: "1 year", "2 years" and "3 years".

var years = 0;

switch(crmForm.all.<name of picklist field>.DataValue) {

    //You need to check the picklist values if they have the values 1, 2 and 3. Look at the attribute in the entity customization and note the option values.
    case "1":
        years = 1;
        break;

    case "2":
        years = 2;
        break;

    case "3":
        years = 3;
        break;
}

if (years != 0) {

    var date = new Date();
    date.setYear(date.getYear() + years);

    crmForm.all.<name of date field>.DataValue = date;
}

Creating a new email when double-clicking a standard text field

if (crmForm.all.<name of text field> != null) {

    crmForm.all.<name of text field>.ondblclick = function() {

        var email = crmForm.all.<name of text field>.DataValue;

        if ((email != null) && (email.length > 0)) {
            window.navigate("mailto:" + email);
        }
    }
}

Resetting a field value if validation fails

In the OnLoad event, place the following code:

crmForm.all.<field to check>.setAttribute("lastKnownGood", crmForm.all.<field to check>.DataValue);

This adds a new attribute to field for later access. In the OnChange event put the following:

//checkFailed contains either true or false and must be set to the result of your validation routine
if (checkFailed) {
    crmForm.all.<field to check>.DataValue = crmForm.all.fieldToCheck.getAttribute("lastKnownGood");
}

else {
    crmForm.all.<field to check>.setAttribute("lastKnownGood", crmForm.all.fieldToCheck.DataValue);
}

Inserting line breaks in a text area control

Put the following in the OnLoad event:

crmForm.all.<your text field>.style.whiteSpace = "pre";

Hiding an entire row of a CRM form

//the field you want to hide
var field = crmForm.all.name;

//search the enclosing table row
while ((field.parentNode != null) && (field.tagName.toLowerCase() != "tr")) {
    field = field.parentNode;
}

//if we found a row, disable it
if (field.tagName.toLowerCase() == "tr") {
    field.style.display = "none";
}