Search This Blog

Friday, June 5, 2009

Add an information message in CRM form


With the following script, you can add an information message to a CRM form


var newcontent = document.createElement("div");
newcontent.id = "message";

newcontent.style.border = "solid 1px black";
newcontent.style.marginLeft = "10px";
newcontent.style.marginRight =
"10px";
newcontent.style.marginTop = "0px";
newcontent.style.marginBottom = "4px";
newcontent.innerHTML =
"<table border="'0'" cellspacing="'0'"
cellpadding="'4'"><tr><td
style='width:20px;background-color:#FFFFAE'><img
src="'/ico/16_info.gif'/" /></td><td
style='font-family:Tahoma;font-size:11px;padding-left:8px;background-color:#FFFFAE;width:100%'>This
is an information
message.</td></tr></table>";

var scr = document.getElementById(elementId);
scr.insertBefore(newcontent, scr.firstChild);



Juste replace elementId with:
"areaForm" to place the message on top of tabs
"tabX" to place the message in the tab X (X is the index of the tab)


[UPDATE]
Si had put a easier and more integrated solution in the comments. So I put his solution right here to avoid further navigation. Thank you, Si!
Nice, just used this but you can see from the screen shot that inserting
the div as the first child of areaFrom makes the bottom of the form disappear,
you can't see the bottom of the scoll bar is not visible.
I've checked the form dom and there's a nice div called Navigation that is
already styled with a yellow backgroundHere's your code altered slightly that
allows CRM to format the screen correctly, it can also be called multiple times
and will update the text.

var sText = 'Hello World!';
var elementId = 'Notifications';
var id = 'divMessage';
var src = document.getElementById(elementId);
var newcontent = document.createElement("span");
newcontent.id = id;
newcontent.innerHTML = "<table><tbody><tr><td><img src="/_imgs/ico/16_info.gif" /></td><td valign="'top'">" + sText +
"</td></tr></tbody></table>";
src.style.display = "";
var previous = src.firstChild;
if (previous == null previous.attributes['id'].nodeValue != id)
{
if (src.childNodes.length == 0)
src.appendChild(newcontent);
elsesrc.insertBefore(newcontent, src.firstChild);
}
else
src.replaceChild(newcontent, previous);

6 comments:

Anonymous said...

Nice work Tanguy,

could you make it dynamic based on a note?

bsrds, Fred

Si said...

Nice, just used this but you can see from the screen shot that inserting the div as the first child of areaFrom makes the bottom of the form disappear, you can't see the bottom of the scoll bar is not visible. I've checked the form dom and there's a nice div called Navigation that is already styled with a yellow background

Here's your code altered slightly that allows CRM to format the screen correctly, it can also be called multiple times and will update the text.

var sText = 'Hello World!';

var elementId = 'Notifications';
var id = 'divMessage';
var src = document.getElementById(elementId);

var newcontent = document.createElement("span");
newcontent.id = id;

newcontent.innerHTML = "<table><tr><td><img src='/_imgs/ico/16_info.gif' /></td><td valign='top'>" + sText + "</td></tr></table>";

src.style.display = "";

var previous = src.firstChild;
if (previous == null || previous.attributes['id'].nodeValue != id) {
if (src.childNodes.length == 0)
src.appendChild(newcontent);
else
src.insertBefore(newcontent, src.firstChild);
}
else
src.replaceChild(newcontent, previous);

Ted said...

Thanks, this is very useful!!!

Anonymous said...

Hi Tan,

Just curious to know wat does the information page does? I mean what happens with this code. Wat information will be displayed on the crm form?
Can you pls explain so that even I can use it?

Regards
Prince

Sebastian said...

Hello,

i need little hint to implement this.
I copy the code from si in my onload form event.

But i can't see something.
What is my misttake?

Thanks
Sebastian

Si said...

Sebastian,

You should see a yellow information bar appear on the form.

Did you tick the event is enabled tickbox on the onload form event form?

Si