Author: Paul Way

Born and raised in Greenville, SC. I'm a coder to the core. The only thing I love more than coding is my family and your epic comments.
7Feb

Chasing a Dream

 A goal is not always meant to be reached, it often serves simply as something to aim at.
Bruce Lee

This week I heard for yet another time that I did not make my goal of being a Microsoft MVP for CRM Dynamics.  Some around me encouraged me to keep going, keep digging, and keep embracing the Microsoft community.  A few said forget about them, that I share more with people directly than blog posts could ever capture.  Others, told me to drop the pursuit entirely since it wasn’t something I’d ever realize.

User Adoption of CRM can sometimes be like this award I’m chasing.  First of all, you can’t strong-arm people into using CRM; instead, you have to match their needs well enough for them to want to use the system.  Secondly, you have to research what matters to them.  For user adoption, it’s often the case that I sit down with users one-on-one and experience a day in the life of what they do.  I take notes of redundancy or monotonous activities but avoid commenting on it, unless they complain about something being mundane.  With the award, I’m turning over every stone I can to find out how others have achieved it.  With user adoption, you have to find what’s missing and if they’re not using CRM for something, then what is filling their need.

If you’re discouraged with your CRM User Adoption, realize that CRM works and it works really well.  If users are resisting the system, go back to them and make sure they are involved throughout the configuration process.  Talk to them about what they like and build on the wins.  In the end, it will take time, patience, and encouragement.

Failure is interesting, but it doesn’t mean the story ends there.  I realize that everyone around me is trying to make me better, make me feel better, or just allowing me to not dwell.  Luckily, I’m not upset or discouraged.  Instead, I’m motivated.

26Sep

Introducing CRM Data Detective

With my eyes focused on visual studio, I didn’t even notice her walk into my office.  No knock, no “hello”, just an aura of frustration crashed into one of my pleather chairs.  I looked up to say “hi” and was met with a  silent cry for help.  I’ve seen this look before and knew whatever it was, it wasn’t going to be easy.

Turns out a new customer was coming to us after a failed CRM implementation with another partner.  Doing what I do, I see it every now and again.  This customer, was a really good kid, but unfortunately got mixed up with the wrong crowd.  It happens.  You can’t blame the kid, but sometimes those shiny lights turn out to have a dim glow and user adoption turns into user betrayal.

My colleagues frustrations came from how the configuration was all over the place.  Fields were scattered all over the place; some were used, some were hidden, but all of it was a mess.  We didn’t have a requirements document to fall back on, but we did have one crazy idea to solve this mystery… CRM Data Detective!

CRM Data Detective Landing Page

CRM Data Detective Landing Page

Granted, CRM Data Detective wasn’t our only method, but it clearly helped.  We used the Data Detective to analyze the customer’s CRM environment and got a handle on what attributes we could remove and which attributes needed to be more prevalent on the form.  Another case closed and another happy customer.
18Jan

CRM 2011 – Creating a 3rd-Party Dashboard Widget

The “snapshot view” of Dashboards within CRM 2011 is a phenomenal feature that many organizations neglect.  If in your environment people seem to disregard your dashboard needs, then this should hopefully help add some spice.

Today, we’re going to create a widget for a customizable list of stocks.

image

Although stocks may not apply to your needs specifically, I hope the concept of bringing in data from outside CRM into a dashboard widget will be something you’ll see the need for.

 

Preparing our Entity

To start, we’re going to use the account entity.  Luckily for us, the account entity already contains an attribute for us to use called “Ticker Symbol”.  (Microsoft knew I’d want something cool to blog about in 2013).  So, our first step is to add this stock symbol attribute to our form so we can update any of our publicly traded accounts.

image

 

If you notice, the “Ticker Symbol” field includes a hyperlink.  When the user double clicks the link it will take them directly into the MSN money page for the symbol, which is a pretty cool feature.

Taking this further…

I also went ahead and included an ownership attribute.  This would allow you to use some JavaScript to show or hide the ticker symbol field.  Additionally you can create a view called “Public Companies without a Stock Symbol” to help find newly created companies without stock symbols more easily.  Or you could require the ticker symbol for public companies.  That’s what I love about CRM – wicked flexibility.

Once we have added the field to the form, let’s update a few companies with their appropriate stock symbols.

 

Getting the Stock Symbols out of CRM

Now that our form configuration is done, let’s do a little development work.  I began by building a new Solution called “Stock Widget”.

image

Inside of my solution, I’m using jQuery and JCL.  I also created a listing.html web resource to get started working with.

So far, here is what I have (the final code is available for direct download at the end of the post):

image

 

This is pulling our related companies and creating a URL to query the JSONP service.  The window.open command (line 38) should prompt you to download a text file.  You can then copy and paste the text file into a JSON formatter (e.g.http://jsonformatter.curiousconcept.com/).

A quick aside…

To query the data, we’re using Fetch.  Since I based this query off of the “My Active Companies” view, I went to the advanced find from the view and clicked “Download Fetch”.  This allowed me to mostly copy and paste this fetch into my JavaScript.  I had to add the tickersymbol filter line, but most of my work was already done for me.

Notice also in this file, I’ve established paths within my web resources.  This is good practice for keeping your web resources organized within your environment.

 

Getting the Stock Data

Now, we need to handle the stock results we’re getting back.  From our previous step, we were able to get a nicely formatted JSON set of data.  This step is about calling the JSONP stock service and actually do something with the results.

image

There are three changes in this step we need to make:

  • Add the callback parameter (Line 24).
  • Add our “processStockInfo” function (Lines 43-52).
  • Replace the window.open line with an AJAX call to the JSONP stock service (Line 39).

These changes collectively convert the JSON results into a table with specific stock information.

 

Cleaning up the Widget

Once we have this updated inside our solution, let’s add our widget into a dashboard. Here’s what we get:

image

At this point the widget looks ugly.  Let’s apply some CSS to make this look like it’s a native CRM add-on.

image

Putting it all together, we end up with the following control on our dashboard:

image

 

Going Forward

This post focused on creating a 3rd party widget; however, you could create your own JSONP service to display any kind of data just as easily.

All of the code can be downloaded here:  https://github.com/paul-way/JCL/tree/master/Examples/Stock%20Listing

If you made it this far, I’m sure you’re well versed with knowing CRM stands for Customer Relationship Management.  I’m sure you’re also familiar with the term XRM.  However, instead of thinking about “eXtensible Relationship Management”, I want you to start thinking “eXtensible Relationship Mash-up”.  If that’s too cheesy for you, I at least hope this little demo is a reminder that data doesn’t have to live in CRM for data to be used inside of CRM.

As always follow me on twitter (@paul_way) and let me know if you like it or hate it.  Also, throw some comments out there.

I hope you enjoy!

4Feb

XRM 2011 JavaScript: Another 101 Lesson in Microsoft Dynamics CRM 2011

When you’re learning JavaScript, you’ll often come across the need to do something to every field on the form.  When you do, it’s important to have efficient code to make such widespread changes so the user doesn’t have to wait for the JavaScript to finish.  This lesson consists of several parts, some of which you’ll probably already know but hopefully there are some things in here for everyone.

Setting up our Environment

First thing first, open your CRM 2011 development environment and browse to an account form.  Once the account form is open, hit F12 on your keyboard.  A window should popup that looks like this:

image

If instead, you see the window in the bottom of your browser page.  Click the little “Unpin” button shown here:

image

 

This is IE Developer Tools and if you haven’t used this in the past, then I hope you enjoy not having to save/publish/refresh/test nearly as often.  To start, we’re going to see how many fields we have on the form.  When inside of the CRM form, we’d use something like:

Xrm.Page.data.entity.attributes.getLength()

But when we’re inside Developer Tools, we actually have a different context.  So we need to click on the “Console” tab and execute:

frames[0].Xrm.Page.data.entity.attributes.getLength()

image

 

Anything we want to execute on the form, we can do by simply prepending “frames[0].” in Developer Tools to get the proper context.  This allows us to write and test code instantaneously, which is a huge timesaver.

Read More »

13Jan

XRM 2011 – Microsoft Dynamics CRM 2011 Style Buttons

Adding a button to a Form is a great way to add additional functionality right where the user is already focused. Today we are looking at a few different approaches to adding a button. First, we’re looking at handling the upgrade for those of you who have already used the 4.0 button inside of 2011 or if you had a 4.0 environment and are upgrading. If you have a clean 2011 environment, then feel free to skip down to the “From Scratch” section.

There is already some code floating around to create a 4.0 style button inside of CRM 2011. The button we’re creating will instead create a CRM 2011 style button (i.e. “Example Button”).

image

 

The CRM 2011 button starts gray and then when the user hovers over it, the button will look like:

image

Read More »

12Jan

CRM 2011 – iFrames & Saving

After spending time on several of the CRM forums, I noticed a few people having trouble with iFrames and saving data inside of the iFrame. While a forum post is a little difficult to write a full response, I wanted to share some insight on capturing the form save event to then trigger a save event inside of your iFrame.

From a business case, this is a fantastic way to tie multiple systems together. If all you are doing is syncing data, then look first at a plugin or scribe. However, if you are looking for the user to interact with multiple systems simultaneously, then an iFrame is a wonderful way to integrated with an existing system. A good example might be where CRM is only storing the summary information and the iFrame contains the details. The user may update the details which should save both the CRM record and the details of the web site.

Prerequisites

First, let’s assume you have an iFrame inside an entity.

Secondly, we need to uncheck the “Restrict cross-frame scripting” check box on the iFrame properties.

image

Lastly, it’s a good idea to make sure our iFrame is using HTTPS to prevent mixed mode security warnings.

 

Talking Directly

If you try to talk directly to the iFrame via something like:

Xrm.Page.ui.controls.get(‘IFRAME_opp’).getObject().contentWindow.document

Unless you are On-Premise, you may encounter the “Access is Denied” warning. This will show itself when dealing with URLs on a different domain (or subdomain). Cross domainscripting is a security feature within the browser. Now an easy fix is to disable the browser settings, but this isn’t a good solution.

 

Messaging

Instead of talking directly, we need send a messages to our iFrame. To send a message, we’d do something like:

Xrm.Page.ui.controls.get(‘IFRAME_opp’).getObject().contentWindow.postMessage(‘test’, “*”)

To receive the message on the iFrame, you need to listen for the message event. Let’s take a look at the JavaScript on our example iFrame page:

 

It is very important to check the origin and the message if you are dealing with publicly facing sites.

If the idea of messaging is new to you, here are some additional resources:

 

The OnSave

To initiate the message from the CRM 2011 form, you need to register an OnSave event from within the “Form Properties”.

image

 

How about .NET Pages?

If your iFrame is an ASPX page, all of this still applies. The only difference is that you want to have an ASP.Net button on your page to call the server side code. Instead of the saveForm event, simply call the click event of the button.

When dealing with server side saves though, you can either post a message back to say “I’m done” which will then complete the CRM save or you can put a set timeout in the onSave on the CRM side.

 

Conclusion

Hopefully you have seen how easy it is to integrate with another web site while inside of CRM 2011. If you have had problems with iFrames in the past, I really encourage you to use iFrames for your integration needs as they can really enhance your users experience and can allow for improved data across systems. I hope you enjoy!

1Dec

CRM 2011–Excessive Sub-Gridding

Sub-grids enhance the user experience by conveniently providing associated information.  Within a sub-grid the user can easily view, create, or modify a related entity.  By default, Microsoft will auto-populate up to four sub-grids.

image

 

One thing to note however is that if the form contains more than four sub-grids, then sub-grids 5+ will contain a message inside the sub-grid “To load x records, click here”.  To populate the sub-grid, the user has to click the refresh button or the link.

image

 

CRM 2011 does this intentionally to make sure the User is presented with the Form as quickly as possible.  Each sub-grid is another Fetch call to the database, so reducing those inherently speeds up the form.

Now what if you only need a few more sub-grids and you are ok with the potential performance trade-off?  Well, let’s add a little JavaScript to auto load all of our sub-grids that didn’t auto load already:

function getLinksWithClassName(classname)  {
var bdy = document.getElementsByTagName(“body”)[0];
var els = [];
var re = new RegExp(‘\\b’ + classname + ‘\\b’);
var lnks = bdy.getElementsByTagName(“a”);

for(var i=0,j=lnks.length; i<j; i++)
if(re.test(lnks[i].className))
els.push(lnks[i]);

return els;
}

var lnksUnloaded = getLinksWithClassName(‘ms-crm-List-LoadOnDemand’);

for (var i = 0; i < lnksUnloaded.length; i++){
lnksUnloaded[i].click();
}

 

Now adding the bottom four lines to our OnLoad event will cause all of our sub-grids to auto-load.  Hope you enjoy!

29Aug

CRM 2011 Form Customization (Part 2)

A while back we looked at customizing the CRM 2011 header and footer.  I got some really positive feedback, but some people were tripped up.  Troubleshooting via blog is difficult, so whenever you have problems feel free to tweet me (@paul_way).  Today, I’m going to go into great detail of changing the form again, but this time we’re going to add a new twist.  Take a look at the before and after:

 

image

Before

 

 

image

After

 

 

Now some of you may be wondering what I changed.  First, we still have the light blue shading on the header.  Secondly, we moved the footer to the left navigation.  User’s may never request changing the color of the forms, but that was intended to show you that you could style the forms any which way you wanted.  Moving the footer to the left hand navigation is quite practical.  Some users may be faced with smaller screen resolutions and this will really free up space if  you intend to put a lot of information in the footer (especially if you are adding to the header already).

 

Step-by-Step

Setting up our Web Resources

The first thing you’ll need to do is create a solution.  I called mine “Form CSS Customization”.  In it we are going to add two web resources.

image

 

For our initial web resource we’ll create is a CSS file:

Take note of the name of  your CSS file, as we’ll use this in a minute.  The CSS file contains the shading on the header as well as some custom table formatting that we’ll use with our JavaScript file.

Now, let’s add our JavaScript file:

function load_css_file(filename) {
var fileref = document.createElement(“link”)
fileref.setAttribute(“rel”, “stylesheet”)
fileref.setAttribute(“type”, “text/css”)
fileref.setAttribute(“href”, filename)
document.getElementsByTagName(“head”)[0].appendChild(fileref)
}

function myFormOnLoad() {
load_css_file(‘/WebResources/cei_/css/case.css’); // don’t forget to change the file!
moveFooterToNav();
}

function moveFooterToNav() {

var tbl = document.getElementById(‘crmNavBar’);
var row = tbl.insertRow(tbl.rows.length);
var cFoot = row.insertCell(0);
var txt = document.createTextNode(‘testing…’);
cFoot.appendChild(txt);
cFoot.id = ‘myCustomNav’;
document.getElementById(‘myCustomNav’).innerHTML = “<table class=’myNavFoot’ cellspacing=’0′ cellPadding=’0′>” +
“<tr><td class=’ftLabel’>Created</td></tr>” +
“<tr><td class=’ftValue’>” + document.getElementById(‘footer_createdby_d’).childNodes[0].innerHTML +
“<br />” + document.getElementById(‘footer_createdon_d’).childNodes[0].innerHTML + “</td></tr>” +
“<tr><td class=’ftLabel’>Modified</td></tr>” +
“<tr><td class=’ftValue’>” + document.getElementById(‘footer_modifiedby_d’).childNodes[0].innerHTML +
“<br />” + document.getElementById(‘footer_modifiedon_d’).childNodes[0].innerHTML + “</td></tr>” +
“</table>”;

}

The JavaScript file is doing two important things.  First, it is injecting the CSS file into the header of the page.  This basically tells the browser to pickup the CSS file as if it was always part of the page.  After loading the CSS file, the JavaScript will append a table to the left area nav bar.  This table is completely custom and you can style it any which way you want.  Be careful using Xrm.Page.getAttribute() here, because even though the field is in the footer it may not be accessible to the Xrm object.  In my case, the attributes I’m using were not on any of my tabs.

Changing the JavaScript

You must change the “load_css_file” function to contain your specific web resource.  To find the web resource name, it’s easiest to look at the CSS web resource inside of CRM:

image

 

Configuring the Form

Now we need to go to the form we are customizing.  The first step is to add everything we want to onto the footer.

image

 

Next, we’ll edit the form properties.

image

When editing the Form Properties, we’ll need to add the JavaScript library and add our onLoad function to the Form OnLoad.  In our example, the function we’re using is called “myFormOnLoad”.

After this, we simply hit OK, Save, and Publish.

 

Reviewing the Finished Product

image

As you can see, we made subtle changes to improve the overall look and feel for the user.  We also provided a real-life situation where you may need to squeak out some additional room for the user.  Hope you enjoy!

23Aug

CRM 2011–Changing the Form Header and Footer Colors

CRM 2011 has a beautiful default theme.  Microsoft has already organized the CRM 2011 folder structure to support themes, but currently only supplies the Silver theme.  Office 2010 on the other hand contains Silver, Blue, and Black.

themes

 

Today we aren’t going to modify the entire theme, but modify the form header and footer.  The code I’m going to include is a small gradient, but you could choose a solid background or any color you’d like.  I was going to use a Clemson, I mean Customer Effective, Orange, but instead focused more on the blue theme look.

 

Before

before

 

After

after

 

Adding our CSS Web Resource

Granted this change was very minor, but you could do about anything you wanted to with it.  To accomplish this basic change you must first upload a CSS web resource (I named mine new_header.css) with the following styling:

.ms-crm-Form-HeaderContainer{
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffB3CAEC, endColorstr=#fff6f8faE);
}

.ms-crm-Form-Footer{
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffB3CAEC, endColorstr=#fff6f8faE);
background-image: none;
}

Note: The filter property is an IE specific CSS attribute.  It isn’t supported in any other browsers (they will just ignore it), but Internet Explorer 7+ supports it just fine.

 

Modifying the OnLoad

Our next step is to modify the onLoad to inject the CSS file.  We’ll do this by adding the following JavaScript to a web resource:

function load_css_file(filename){
var fileref = document.createElement(“link”)
fileref.setAttribute(“rel”, “stylesheet”)
fileref.setAttribute(“type”, “text/css”)
fileref.setAttribute(“href”, filename)
document.getElementsByTagName(“head”)[0].appendChild(fileref)
}

function myFormOnLoad(){
load_css_file(‘/WebResources/new_header.css’);
}

 

Changing the Form Properties

Finally we need to change the form properties to include this JavaScript web resource in the library and add our “myFormOnLoad” function to the OnLoad Event for the Form:

image

 

Conclusion

After going through this blog, hopefully you will see how easy it is to change the form header, footer, or anything else.  By embedding a CSS file, our ideas are our only limits.  Hope you enjoy!

© Copyright 2012-2014, All Rights Reserved