HTML Web Resources in Dynamics CRM

This post is just an introduction to a set of posts detailing how we can start taking advantage of HTML5 and some open source JavaScript libraries and frameworks within Dynamics CRM.

In this first post, we’ll be looking at getting to the most basic information from within a HTML Web Resource. Of course, knowledge of JavaScript and some basic CSS is required :)

For the sake of this example, and to keep things simple and easy to read, the script and the CSS are all built in the same file. Normally you would create a structure of 3 separate files, a HTML file, a JavaScript file and CSS file.

Start by creating a new HTML web resource. Place it in a iFrame on the Account entity.

The following code is commented to be self-explanatory, and is only meant to serve as a reference. Some of these calls will be used in future articles when we start looking at providing some real functionality on our records.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
    <head>
        <title>Context Info</title>
        <style type="text/css">
            body {
                background-color: #b0c4de;
            }

        </style>
    </head>
    <body>
        <script type="text/javascript">
            // debugger;
            var xrm = window.parent.Xrm;

            // Display the client information
            // Web for Browser
            // Outlook for Outlook
            // Mobile for Mobile
            var _client = xrm.Page.context.client.getClient();
            document.write("Client: " + _client + "<br />");

            // Get the client’s URL
             var _clientURL = xrm.Page.context.getClientUrl();
             document.write("Client URL: " + _clientURL + "<br />");

            // Get the current theme
            // for Outlook
            // returns the following values:
            // Default for Web
            // Office12Blue for Microsoft Dynamics CRM for Outlook 2007 or 2010 Blue Theme
            // Office14Silver for Microsoft Dynamics CRM for Outlook 2007 or 2010 Silver or Black Theme
            var _clientTheme = xrm.Page.context.getCurrentTheme();
            document.write("Client Theme: " + _clientTheme + "<br />");

            // Get the base language
            var _baseLanguage = xrm.Page.context.getOrgLcid();
            document.write("Base Language: " + _baseLanguage + "<br />");

            // Get the Organization Unique Name
            var _orgUniqueName = xrm.Page.context.getOrgUniqueName();
            document.write("Organization Unique Name: " + _orgUniqueName + "<br />");

            // Get the current User ID
            var _userID = xrm.Page.context.getUserId();
            document.write("User ID: " + _userID + "<br />");

            // Get the User Language
            var _userLanguage = xrm.Page.context.getUserLcid();
            document.write("User Language: " + _userLanguage + "<br />");

            // Get the User Name
            var _userName = xrm.Page.context.getUserName();
            document.write("User Name: " + _userName + "<br />");

            // Get the User Roles IDs
            var _userRoles = xrm.Page.context.getUserRoles();
            document.write("User Roles: ");
            for (var i = 0; i < _userRoles.length; i++) {
                document.write(_userRoles[i].toString() + ", ");
            }
            document.write("<br />");

            document.write("Window size: " + this.innerWidth + ", " + this.innerHeight + "<br />");

            document.write("Working with record data: " + "<br />");

            // debugger;

            // Get a reference to the entity
            var _entity = xrm.Page.data.entity;

            // Get the entity name
            var _entityName = _entity.getEntityName();
            document.write("Entity Name: " + _entityName + "<br />");

            // Get the entity ID
            var _entityID = _entity.getId();
            document.write("Entity ID: " + _entityID + "<br />");

        </script>
    </body>
</html>

The output when opening a new Account form should be as follows:

image

On an existing record you will also get the Entity ID.

Now with all this information, we can start building something more interesting. Future posts will go into retrieving related data, and building some other functionality with it. So, stay tuned :)

Enjoy!

One thought on “HTML Web Resources in Dynamics CRM

Add yours

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 )

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

Create a website or blog at WordPress.com

Up ↑

%d bloggers like this: