Finding crmForm elements By Css Class Names

There are situations where you need to change form elements text or appearance dynamically, i.e. changing a section name or page title, but find it “impossible” since the form html DOM doesn’t include identifiers for those elements.

Most examples I’ve seen regarding similar requests use a simple drill down (or up) mechanism from a certain anchor element, usually the closest element the target.
For example:

var anchorElement = document.getElementById(“An Element WithID”);
var targetElement = anchorElement.parentElement.parentElement.parentElement;
    targetElement.innerText = "New Text";

This type of method is less then elegant and is a highly unmanageable technique.

In order to address this issue I’ve created a simple getElementsByClassName function which is a method similar to the already known getElementsByTagName function. The function receives an anchor element ( or null ) and a css class Name and return an array of html element that match the class Name. This type of mechanism is actually very popular in most JavaScript libraries like jquery and prototype.

The following code includes getElementsByClassName function and two common requests that are handled by that function.

function OnCrmPageLoad()
{
 //Example #1: Change Address Section Text
 var anchorNode = document.getElementById( "tab0" );
 var secBarCss  = "ms-crm-Form-SectionBar";
 var addrSecTxt = "Address";
 var addrSecElm = null;
 
 var results = getElementsByClassName( secBarCss , anchorNode );
 for( var i = 0 ; i < results.length ; i++ )
 {
  if( results[i].innerText == addrSecTxt ){
   addrSecElm = results[i]; break;
  }
 }
 
 addrSecElm.innerText = "Partial Address Information";
 
 //Example #2: Change Account title form account: name to account: name (accountnumber)
 anchorNode = null;
 titleCss   = "ms-crm-Form-Title";
 titleTag   = "SPAN";
 titleElem  = null;
 
 results = getElementsByClassName( titleCss , anchorNode );
 for( var i = 0 ; i < results.length ; i++ )
 {
  if( results[i].tagName == titleTag ){
   titleElem = results[i]; break;
  }
 }
 
 var accountNumber = crmForm.all.accountnumber.DataValue;
 if (accountNumber == null) 
  accountNumber = "Not Supplied";
 
 titleElem.innerText = titleElem.innerText + " (" + accountNumber + ")";
}

function getElementsByClassName(className, anchorNode)  
{    
 if(!anchorNode) anchorNode = document.body;    
 var result = [];    
 var regEx  = new RegExp("\\b" + className + "\\b");    
 var children = anchorNode.getElementsByTagName("*");    
 for( var i = 0 ; i < children.length ; i++ )        
 {
  if( regEx.test( children[i].className ) )
   result.push( children[i] );    
 }
 return result;
}

OnCrmPageLoad();