Show field schema names in CRM 4.0 form editor

I recently worked on a project where the requirement was to rebuild an Excel-based quoting worksheet within a Microsoft Dynamics CRM 4.0 form.

Besides the code complexity (e.g., triggering the field onchange events appropriately), the other challenge was to keep track of the attribute schema name for 50+ form fields. (Note: The CRM form editor shows the attribute display name in each field rather than showing the attribute schema name. You can double-click a field to see its schema name but that’s too many clicks when you’re dealing with so many fields.)

What I really needed was a print-out of all of the form's tabs with the attribute schema name appearing in each of the fields. This would allow me to write the form’s Jscript code faster since I wouldn’t have to match field display names to schema names using the /sdk/list.aspx tool or other method.

One solution I came up with to show the field schema names within the form editor was to use the Script Editor that’s available in the IE WebDeveloper UI to change form’s HTML DOM on-the-fly.

Here’s how to do this:

1. Login as an administrator in the CRM web application.
2. Open the form editor for an entity.
3. Press Ctrl-N to open the form editor in a window that gives you access to the IE WebDeveloper tool.
4. In IE WebDeveloper, go to the Script Console and click Run Script.
5. Copy/paste the code I’ve provided below and run it.
6. Take a screenshot of the form.

Here’s a sample CRM form with the field attribute schema names showing.

Run this Jscript  code in the IE WebDeveloper tool’s Script Console window:

document.getElementsByClassName = function(cl) {
  var retnode = [];
  var myclass = new RegExp('\\b'+cl+'\\b');
  var elem = this.getElementsByTagName('*');
  for (var i = 0; i < elem.length; i++) {
    var classes = elem[i].className;
    if (myclass.test(classes)) retnode.push(elem[i]);
  }
  return retnode;
};
var crmFormFields = document.getElementsByClassName("field");
var crmReadOnlyFields = document.getElementsByClassName("rofield");
if (crmReadOnlyFields.length > 0) { crmFormFields = crmFormFields.concat(crmReadOnlyFields); }
var crmFieldId;
var crmFormField;
for (var i = 0; i < crmFormFields.length; i++) {
  crmFormField = crmFormFields[i];
  crmFieldId = crmFormField.parentNode.parentNode.parentNode.parentNode.id;
  crmFormField.innerText = crmFieldId;
}

Hopefully this will save you some time next time you’re working with a form and need quick access to the field schema names.
-Tim