Microsoft Dynamics CRM 2011 and Microsoft Dynamics CRM Online - Image (PNG, JPG, GIF, ICO) Web Resources

Web resources are a great step forward and were introduced in Microsoft Dynamics CRM version 2011.

Web resources are a great way to act as a container. Web resource can store a piece of JScript code, image, etc.

Web resources are virtual files which are always stored in the Dynamics CRM 2011 database. This is beneficial as we don't have to worry about the physical files and their locations.

Web resources have a unique path and can be accessed through that URL. This is beneficial as we can use the URL in our code.

There are the following kinds of web resources:

• JScript
• XML
• XSL
• Image (types are ICO, PNG, JPG, GIF)
• HTML
• CSS
• Data
• Silverlight

The 3 most widely used types are JScript, HTML and Image. Read my blog for more information on Script (JScript) Web Resources.

In this blog I will show how to create and use an image web resource.

Image web resources are the container for the images in ICO, PNG, JPG or GIF format. Image web resources can be used for:

• Custom Entity Icons
• Display images on the Entity Forms
• Icons for Custom Ribbon Buttons
• Icons for Site Map

In this blog I will create an Image web resource to store a JPG image. I will include this image on an entity form.

1) I have an entity called "Movies". I have few movie records.

"Movies" Entity and Records

2) In the movie entity record, I want to place an image on top of the form. This image will be the same for every movie entity record. Below I have shown the area where I would be displaying the image.

Movie Record "Pirates of the Caribbean: On Stranger Tides"

3) I have an image which I would like to display on every form.

Image to be Displayed on Every Movie Form

4) I will create a web resource. I will go to my "Movies" solution.

"Movies" Solution

5) I will go to the "Web Resources" component inside the solution. 

"Web Resources" component inside the Solution "Movies"

6) I will create a new web resource called "Movies Header Image". I have selected the "Type" as "JPG format". This means this web resource is of type image and format is JPG. Click "Save".

Movies Header Image Web Resource

7) The web resource is created. There is a unique URL created for this web resource. This means the image can be accessed through this web resource URL.

By creating an image web resource, we are making sure that this image is available to Dynamics CRM 2011 for use.

The URL created here is:
http://crm2011:5555/AshishMahajan/WebResources/new_Movies.HeaderImage.

Movies Header Image Web Resource Created

8) Publish this web resource. We need to publish the web resource to make it available. After publishing I can start using the web resource in my "Movies" entity form.

Publish Web Resource

9) I will go to "Movies" entity form and insert this web resource. The "Movies" entity is under the Entities component in the solution.

Movie Entity in the Solution

10) Open the main information form for the "Movies" entity.

Open the Main Information Form for the "Movies" Entity

11) Click on the "Insert" tab on the form. Here we have the option to add a "Web Resource". Click on the ribbon button "Web Resource".

Insert Web Resource

12) I have entered the following properties for this web resource. I have selected the image web resource; I created above in the field "Web resource". Click "OK".

Web Resource Properties

13) This will place a control at the end of the section (which is selected).

Web Resource Control Created

14) Since I want to display this control on the top, so I will drag it to the top of "Movie Name" field.

Go to "Home" tab. Click "Save and Close".

Drag the Web Resource Control to the Top of Movie Name Field

15) Publish changes to the "Movie" entity.

Publish the Movie Entity

16) The web resource will be displayed on all the "Movie" entity records. Below, shown, are 3 movie record examples displaying this image.

Movie - Pirates of the Caribbean On Stranger Tides

Movie - Skyfall

Movie - The World Is Not Enough

I have used this blog to create and display an image web resource on an entity form. You can very well display it as a custom ribbon button icon or a site map icon or a custom entity icon.

I hope this blog about 'Microsoft Dynamics CRM 2011 and Microsoft Dynamics CRM Online - Image (PNG, JPG, GIF, ICO) Web Resources' was informative. Please feel free to leave your comments.

Microsoft Dynamics CRM 2011 and Microsoft Dynamics CRM Online - Supported and Un-Supported Code, Customizations and Extensions

Microsoft Dynamics CRM 2011 is a robust application. It is a highly customizable xRM platform which can be used as a non-CRM application.

Dynamics CRM 2011 can be customised and extended in many ways:

• Customizing Site Map 
• Changing Icons
• Customizing Ribbon Buttons
• JScript Web Resources
• Other Web Resources (HTML, CSS, XML, Image, Silverlight, etc.)
• Plugins
• Workflows
• Dialogs
• Custom Workflow Activities
• SSRS Reports
• Integration with other applications through tools like Scribe, etc.

When customising and extending Dynamics CRM 2011, always write supported code. Supported code is the code which falls between the boundaries of Dynamics CRM platform. Meaning the code is well integrated into the Dynamics CRM architecture and is easily upgradeable.

On the other hand unsupported code or unsupported customisations fall outside of what should be done in Microsoft Dynamics CRM 2011. It is not that the unsupported code will not work or not produce the desired results. The unsupported code if written correctly will do the job, but is not supported by Microsoft. In simple words Microsoft takes no responsibility for your unsupported code.

The problems with unsupported code or unsupported customizations are:

• Future service updates or rollups for Dynamics CRM 2011 can reverse your changes. In worst case scenario the installation of the service update or rollup will fail. 

For example, if you change manually any of the core Dynamics CRM files to change the look and feel of CRM. Next time when you try to install the service update or rollup, the installation might overwrite those core files. This will remove your changes and you will have to make those changes again.

• When you try to upgrade to the next version of Microsoft Dynamics CRM, this could lead to many issues. Upgrade from current to future versions will be seamless if your CRM 2011 has all the supported customisations. In case of unsupported customisations, there could be errors as that piece of code could no longer be executed in CRM's programming model.

• If you are a large IT consultancy firm and are involved with your customer for their critical enterprise level Dynamics CRM project. This project involves more than a year of development. Before go-live your customer calls another company for final auditing of this project. If those company's consultants pin-point that there are unsupported code and customisations, this could be a major source of embarrassment for your organisation.

• There is no Microsoft support for unsupported code and unsupported customisations in Dynamics CRM.

Few Examples of Unsupported Customisations

• Document Object Model (DOM): Referencing Document Object Model (DOM) objects in HTML in JScript is not supported. Always use the new CRM 2011 XRM Page programming model. The Document Object Model (DOM) is a cross-platform and language-independent convention for representing and interacting with objects in HTML, XHTML and XML documents. 

You can read more about JScript development and the cheat sheet in one of my blog.

• SSRS Reports: SSRS reports in Dynamics CRM 2011 should always be either Fetch XML based or filtered views based. SSRS reports based on SQL which accesses non-filtered views are unsupported.

In Dynamics CRM database there are always 2 types of views "filtered" and "non-filtered". Non-filtered view is named, based, on the entity's name. For example, "select * from account" will get me all records. "account" here is a view which will combine tables like  "AccountExtensionBase", "AccountBase" and other related tables. "account" view is a non-filtered view which never has security inbuilt into its script. On the other hand if I use "select * from FilteredAccount", I will get only the records to which I have access. Use of filtered views is supported over the use of non-filtered views.

• Direct Database Table Modifications: Direct database table modifications, through code, are unsupported. For example, in a plugin if I have code which changes the status of an entity record through a SQL script, this is unsupported. Always use CRM 2011 web services to make changes to any entity fields.

• CRM 2011 SDK: The best reference for always writing supported code is the CRM 2011 SDK. 

SDK has articles and examples on how to extend and customise CRM. If it's not there in SDK, then it is likely to be unsupported.

• Ribbon: You can always extend Ribbon XML and customise by adding you own buttons. Ribbon buttons defined for system entities are already there when CRM 2011 is installed. You can hide or disable them. You can also use CRM 2011 Ribbon commands. Reuse of CRM 2011 Ribbon JavaScript functions is unsupported. Reason being these functions can be overwritten during upgrade or get deprecated.

• Database Schema Changes: Physical changes to the CRM 2011 database schema are unsupported. This could lead to severe performance issues or even CRM 2011 being unavailable.

The only supported changes are adding new or updating existing indexes.

• Help Content: Changes to the help content for CRM 2011 application is not supported for on-premises.

• Core CRM Files: Changes to Core CRM files in its installation directory is unsupported.

• CRM 2011 IIS Website: Making changes within the CRM 2011 IIS website like adding another website is unsupported.

I hope this blog about 'Microsoft Dynamics CRM 2011 and Microsoft Dynamics CRM Online - Supported and Un-Supported Code, Customizations and Extensions' was informative. Please feel free to leave your comments.

Microsoft Dynamics CRM 2011 and Microsoft Dynamics CRM Online - Get the Form Control ID

Microsoft Dynamics CRM 2011 is a web application. It is setup as a web application in IIS. It can be browsed through the clients such as a web browser or Microsoft Outlook. Previously Dynamics CRM could only be accessed through a single web browser Internet Explorer. The latest release of Microsoft Dynamics CRM called Update Rollup (UR) 12 delivered multi-browser support. The Dynamics CRM 2011 access in Microsoft Outlook is also through Internet Explorer. If you open the records in Microsoft Outlook, they actually open in the Internet Explorer browser window.

In this blog I will show how to get the ID of any Microsoft Dynamics CRM 2011 form controls in Internet Explorer.

There are many occasions where one would need the ID of a control on a Dynamics CRM 2011 form. Like in my case I want to change the images on the form based on the record selected. I have an entity called "Movies". For every movie record there is a "JPG" web resource storing the movie poster image. I want to dynamically display the related image for a movie record.

"Movie" Entity Records

Below are the 3 "Movie" records and the dynamically displayed images (related to the movie).

"Movie" Record Skyfall

"Movie" Record Casino Royale

"Movie" Record GoldenEye

The image, on a CRM 2011 form, is displayed as an inserted web resource control.

"Movies" Entity Form Design Showing the Web Resource Control

This web resource displays an image by default. The same image will be displayed for all movies. In order to dynamically change this image I need to write a JScript web resource. The JScript code displays the image web resource and is dynamically selected based on the "Movie" record name.

JScript Code

As seen above the web resource is selected based on the movie record name. There is an Image Web Resource for every movie and is named after the record name. In Jscript to code the display of the Image Web Resource in the image control, I need the ID of this image control. In the JScript code, above, the ID used is "WebResource_Movie_Images".

I can find the ID of any Microsoft Dynamics CRM 2011 control from the Internet Explorer "F12 Developer Tools". Internet Explorer Developer Tools (formerly known as Internet Explorer Developer Toolbar), is a component of Internet Explorer that aids in design and debugging of web pages. 

Open any "Movie" form. Let's say I have opened the "Movies" entity record GoldenEye. Press F12 on the keyboard to open the tools. Or else select the "F12 Developer Tools" option from the Internet Explorer right hand side "Tools" menu.

Internet Explorer "Tools" Menu

The Internet Explorer window, below, will now display the "F12 Developer Tools".

Internet Explorer Window Displaying the F12 Developer Tools

I want to find out the ID for the image control. Click the arrow button "Select Element By Click".

Select Element By Click

Select the element (control) on the form whose ID you want. In this case I want the ID of the Image so that I can use that in JScript code. Take the mouse cursor on the image and click once. This will open the HTML for the page on left hand side. On right hand side it displays the CSS for the page. The HTML tag for the image is selected and highlighted in blue.

Select The Image Element (Control)

From this highlighted HTML tag (of Image) in blue, we can get the ID. As seen below, the ID is "WebResource_Movie_Images". This is the same ID which is used in the JScript above.

Selected Image HTML Tag and The ID

In this way we can use the Internet Explorer "F12 Developer Tools". Using this tool we can find out the ID of the Dynamics CRM 2011 form controls. These ID can be used in the JScript as I have done above.

A piece of advice: Before using the control and the ID in JScript code, always check whether the code is supported or unsupported. Unsupported code is the one which doesn't conform to the CRM 2011 platform coding principles. If you write unsupported code, there could be problems in installing future service packs or upgrading to the new Dynamics CRM release.

I hope this blog about 'Microsoft Dynamics CRM 2011 and Microsoft Dynamics CRM Online - Get the Form Control ID' was informative. Please feel free to leave your comments.

Microsoft Dynamics CRM 2011 and Microsoft Dynamics CRM Online - Benefits of having the JScript Web Resource Code as a separate JS file

When I create a new JScript web resource, there are 2 ways to add code to it. 

One way is to upload the JScript file to the web resource. This will embed the "JScript file" code inside the web resource.  

 Below is the file in Visual Studio and uploaded as part of a web resource.

JS File in Visual Studio 2010

JScript File uploaded as part of a Web Resource

The other way to create an empty JScript web resource. Later open the JScript web resource and add the code through its text editor.

Web Resource Text Editor

JScript in Web Resource Text Editor

In existing JScript web resources there are 2 ways of making changes to the code. Either you make changes to the code in a corresponding file (if it exists) and then copy paste this code back into the web resource. OR you can open the web resource text editor and make changes.

The best practice is to have a separate JS file for every JScript web resource. This JS file should contain the same code as its corresponding web resource. The main benefit is that these files can be version/source controlled. 

Microsoft Dynamics CRM is not a version/source control application and hence the code inside the web resources cannot be version/source controlled. It is better to have the JS files and have these files version controlled. 

There are many version control software available. My favourite is TFS (team Foundation Server). Team Foundation Server (TFS) is a Microsoft product offering source control, data collection, reporting, and project tracking, and is intended for collaborative software development projects.

If you need to make changes to any web resources, first update the code in the corresponding JS file and then make these same changes inside the web resource. The other way is to make changes in the web resource and test these changes and at the end update the corresponding JS file in the source control.

I hope this blog about 'Microsoft Dynamics CRM 2011 and Microsoft Dynamics CRM Online - Benefits of having the JScript Web Resource Code as a separate JS file' was informative. Please feel free to leave your comments.

Microsoft Dynamics CRM 2011 and Microsoft Dynamics CRM Online - Script (JScript) Web Resources

Microsoft Dynamics CRM 2011 has revolutionised the way we write JScripts in the framework.

In this blog I will create a JScript web resource. This web resource will validate the "Cost of Production (millions)" and "Revenue (millions)". The JScript will calculate whether the movie made a loss or profit and will display a message accordingly. This message will be displayed when a movie record is open.

Steps to create a web resource and bind it to a form.

1) Below is the movie entity record. The movie entity form has 2 fields "Cost of Production (millions)" and "Revenue (millions)". The "Cost of Production" is the cost of making the movie. The "Revenue" is the financial gain from the movie. This gain can be less than or more than the cost and will decide whether the movie has made a profit or a loss.

"Movie" Entity Record

2) I will add a web resource. I already have a solution named "Movies" which has all the entities and components around movie entity.

"Movies" Solution

3) I will open this solution. On left hand side all the component types are displayed for this solution. One of them is "Web Resources". This is where new or existing web resources are added.

"Movies" Solution

4) Click on "New" button to create a new web resource. This will open a New Web Resource form. 

New Web Resource Form

5) Enter the required values. I will name this web resource as "Movies.DefaultForm". The actual JScript code is defined in an external file. When I upload the file to this web resource, it will bind the code to the web resource. In later steps I will display the code in this file. 

New Web Resource Values

6) Click "Save and Close". Publish this new web resource "Movies DefaultForm". Every time we make any changes to a web resource, it needs to be published.

Publish the Web Resource

7) Below is the code inside the uploaded JScript file "Movies.DefaultForm.js". If there are any changes in the code, the best practice is to make changes inside the file and then make the same changes inside the web resource. 

The main benefit of doing that is the code can be made part of a source control repository like Team Foundation Server (TFS). The web resources as such cannot be stored inside TFS but the JScript files can.

This function "OnLoad" will be bounded to the "Onload" event of the "Movies" entity form. I have named this function as "Onload" but you can give any name. This function checks the values in the 2 fields "new_costofproduction" and "new_revenue". If the value of "new_costofproduction" is less than value of "new_revenue", then there is a profit, or else there is a loss. If the values of "new_costofproduction" and "new_revenue" are the same, then there is no loss or profit.

JScript file "Movies.DefaultForm.js" in Visual Studio 2010

8) The web resource is created. Now I will bind the web resource to the "Onload" event of the "Movies" entity form.

I will go to the "Movies" entity main form in the already opened solution "Movies".

"Movies" Entity Main Form

9) Open the "Movies" entity main form. This will open the form in design mode. 

Click on the ribbon button "Form Properties".

"Movies" Entity Main Form - Ribbon Button "Form Properties"

10) This will open the form properties window, from where we can edit the form's properties.

Form Properties Window

11) First we will bind the JScript web resource itself. In the second step we will bind the actual function to the "Onload" form event. Click the "Add" button under "Manage libraries that will be available in the form". This will open the "Look up" to list all the web resources in the solution. You can select a web resource.

My solution only one web resource "Movies DefaultForm". I will select that. Click "OK".

"Look up" Window Listing all the Web Resources in the Solution

12) The web resource is added to the "Movies" entity form.

Web Resource is Added

13) A JScript web resource contains many functions. So it is important to bind a particular function, which contains code required, to execute on the "OnLoad" event of the form. This code will execute when the "Movies" entity record form will open.

Make sure in Event Handlers, you have "Form" selected for "Control" and "OnLoad" selected for "Event".

Click "Add", to bind the function. This will open a new window where I will enter the function name. You can see this function in the screen shot for the JScript, I have in step number 7, above. The Library has the name of the web resource. We can bind more than one web resources to a form. Click "OK".

Bind the Web Resource Function

14) The web resource function will be added as below. Click "OK".

Web Resource Function Added

15) Click on "Save and Close" button. This will save the settings I made and close the "Movies" entity form.

"Save and Close" the "Movies" Entity Form

16) I will publish the changes made to the "Movies" entity form. Click "Publish" to publish the changes.

Publish the Movies Entity Form

17) I am all set to test the web resource. I will go to my "Movies" list.

Movies List

18) Out of the movies in the list, I have 3 movies which I will use to test my JScript web resource code.

The movie "Skyfall" made losses, "Casino Royale" made a profit and "Die Another Day" has made no profit or loss.

Below is the output when I open "Skyfall". As the web resource function is bound to the "OnLoad" event, so the code will execute as soon as the form opens. As you see this movie's cost of production is 200 million and revenue is 190 million. So the loss is of 10 million. As per the JScript (shown above in step number 7), there will be a message displayed with the loss, as seen below.

Movie made Losses

Below is the output when I open "Casino Royale". As you see this movie's cost of production is 100 million and revenue is 200 million. So the profit is of 100 million. As per the JScript (shown above in step number 7), there will be a message displayed with the profit, as seen below.

Movie made Profit

Below is the output when I open "Die Another Day". As you see this movie's cost of production is 50 million and revenue is 50 million. So there is no profit and no loss. As per the JScript (shown above in step number 7), there will be a message displayed with the message of no profit and no loss, as seen below.

Movie made no Profit or Loss

19) As seen, I have written the JScript code in a separate file. I created this web resource and I had uploaded this file. This way the code will become part of the web resource. Next time if I want to make updates to this code there are 2 ways. Either I make changes to the code in the file and then copy paste this code back into the web resource. OR I can open the web resource and then make changes.

The best practice is to make changes in the file and then copy paste, as the files can be version controlled. Click here to read my blog on the benefits of having the JScript web resource code as a separate JS file.

Below are 2 ways you can edit the code. The first screenshot displays the code inside the file "Movies.DefaultForm.js" which can be edited in any text editor. My preference and advice would be Visual Studio (in my case it is Visual Studio 2010). Visual Studio in my experience is the best IDE (Integrated Development Environment).

File "Movies.DefaultForm.js" in IDE Visual Studio 2010

The second screen shot displays the code directly opened from the web resource. Open the web resource "Movies DefaultForm" and click on the "Text Editor" button.

Web Resource Text Editor Button

Below is the code which is part of the web resource or embedded in the web resource and can be edited directly.

JScript in Web Resource Text Editor

I hope this blog about 'Microsoft Dynamics CRM 2011 and Microsoft Dynamics CRM Online - Script (JScript) Web Resources' was informative. Please feel free to leave your comments.