Insert Label After the Field in CRM Form using Javascript

Hi all,
Long time I did not blog any post due to workload.
And this is my first post in this month (I know it is end of the month already)
This post basically a quick one because I have the requirement.

So, the users just want to have guidance when they entering inputs in the system.

Which we can have these solutions:

1. Tooltip (using CRM Field description)

See my post here:
http://missdynamicscrm.blogspot.sg/2014/05/crm-20112013-power-of-description.html

2. Using HTML Web Resource

This is a supported way and very useful as well. But it will make the form slower because will load the web resource and how many web resource you should create and insert. Well, you can create 1 common .html then pass the label text as the parameter

3. Using other way

So, unfortunately if those 2 solutions still not the best choice, we could go to another way using the help of CSS and Javascript.

*This is unsupported way…

And here is the Code

The Code

function insertLabelToField(fieldname, text, objSpan) {
    var elemDiv = document.getElementById(fieldname + "_c");


    //var tbl = document.createElement('table');
    //elemDiv.parentNode.insertBefore(tbl, elemDiv.nextSibling);


    //var tr = tbl.insertRow();
    //var td1 = tr.insertCell();
    //td1.appendChild(elemDiv);
    var td1 = elemDiv;
    //td1.style.borderRight = "2px solid #c1c7c4";
    td1.style.paddingBottom = "5.5px";


    var spanPref = null;


    if (!objSpan) {
        spanPref = document.createElement('span');
        
        //you can change the color condition here
        if (attr(fieldname).getRequiredLevel() == "required") {
            spanPref.style.color = '#e31a1a';
        }
        else {
            spanPref.style.color = '#4b4c54';
        }
        spanPref.style.fontSize = '10.51px';
        spanPref.style.fontStyle = 'italic';
    }
    else {
        spanPref = objSpan;
    }
    spanPref.id = 'spanPref_' + fieldname;
    
    td1.appendChild(spanPref);
    document.getElementById('spanPref_' + fieldname).innerText = text;
}

How to Call