Grid formatting in Microsoft Dynamics CRM Online

One of the most common enhancement requests that we receive from our MS Dynamics CRM customers is changing the look and feel of the default UI / UX. A case in consideration is the default UX of the grid. It is completely unreadable, considering it has no alternative row styling or for that matter, even row separators.

Users these days are spoilt for choices and in such a scenario, an unfriendly UI may lead to customer dissatisfaction in an otherwise perfect implementation. What is even more appalling is that there is no straightforward way of implementing this simplistic feature which is de facto for more than a decade now.

However, inspired by  Bohnnie Maity’s blog on conditional formatting for CRM 2013 sp1/2015 grids using actions, I have made changes in the code to make the grid a little captivating.

This is the standard grid available in Dynamics CRM 2015/2016

Standard grid in MS Dynamics CRM – 2015/2016

After modifying the CSS classes in JavaScript, the Grid looks a tad different, more attractive and easier to analyze records in the associated rows.

Grid with gray colored alternative rows

For achieving this output, use the following JavaScript code,

Pro-Tip

You can call this JavaScript function by simply creating a hidden button on every (Global) entity form as a web resource. For your ease, kindly use ribbon workbench tool inside MS Dynamics CRM solution.