Saturday, November 28, 2009

Dynamics CRM Grid customizations - virtually anything possible

(A quick guide on how to dynamically modify the look and content of a Dynamics CRM Grid)


Intro

For each project based on the CRM framework which I dealt with, I had plenty of customer requirements around the grids’ look & behaviors. I’m planning to briefly describe hereby some easy ways to implement some of the most requested customizations. Note that all these customizations are not supported nor compliant with MSCRM SDK.

One core functionality you’ll need to address in order to be able to implement my samples below and any others you might need around the grid, is to catch the load event of the grid control. Once you’re able to execute your custom function on grid loading event, you can then browse the document’s DOM and dynamically change the look and behavior of any document element including the grid itself.


The code

A simple way (not the cleanest, I admit) is to define in the /_static/_common/scripts/Globaj.js file an array of functions to be called when the appropriate grid loads:

var grid_onGridLoadDelegates = new Array();
grid_onGridLoadDelegates[New_invoice_line] = new_invoice_line_onBeforeGridLoad;

This code defines the array of functions and then have the function new_invoice_line_onBeforeGridLoad(...) called when a grid displaying entities of type “new_invoice_line” gets loaded.

Then, you’ll need to add several lines in the /_static/_grid/AppGrid_DefaultData.htc file, at the end of init() function:

if(grid_onGridLoadDelegates!=null && grid_onGridLoadDelegates[this.element.oname]!=null)
{ 
   grid_onGridLoadDelegates[this.element.oname].call(this, window, this.element);
}

Thus, you can already define like this your custom function to be executed when the grid is loaded:

function new_invoice_line_onBeforeGridLoad(parentWindow, grid)
{
...
}

That’s pretty much it! Here are below some examples based on this approach.


Examples

Have particular column for a boolean field replaced by checkboxes when the grid loads.










Implement a “Position” column where the numeric value is replaced by Up/Down arrows having actions which perform server side call for recomputing the line’s position and refresh the grid afterwards.












Have some fields in a column displayed in a variable look, depending on the cell value.








There you go. Let me know if you find this useful.

A+

3 comments:

  1. classic, thanks !

    by the way, how can I manipulate it with self-defined entity? cause it seems this sentence below

    grid_onGridLoadDelegates[New_invoice_line] = new_invoice_line_onBeforeGridLoad;

    works only fine with the standard entities.


    thanks in advance! James.

    ReplyDelete
  2. Hi,

    I'm not sure I understand the question; this applies to both standard & custom entities (I had no issues related to this aspect.)

    A.

    ReplyDelete
  3. Very useful.

    Any chance of getting the code for the coloured 'Priority' column?

    ReplyDelete