Tuesday, June 15, 2010

CRM 4.0 Network Resource Image Control

As the name suggest this is an on-premise / VPN solution so consider if you need this to work across the web / IFD. The idea is to utilize a simple network share together with VB 6.0 Common Control Open Dialog which can be summoned using JavaScript. The nice thing about the Dialog is that it enables you to see files as thumbnails, set the initial directory and return the selected image path into a text attribute. That’s pretty much what you need to make this work.

You can add an ISV toolbar button to pop the dialog but I find that this solution works hand in glove with the text image button post I wrote a while ago.
Here is what is did in a nutshell:

1. Add a new text attribute. I used the pager attribute on the contact form for the sake of this example.

2. Add a new Fixed Field 1:1 section to the contact form. This is done so the IFRAME
that displays the image will occupy half the screen.

3. Then add a the image IFRAME and pointed it to a default blank.jpg image.

4. Arrange the form attributes as you like … here is what I did.

5. Set the path attribute to read-only so selection is possible only when using the dialog.

6. Add the following code to the contact on load event box.

And Finally don't forget to create a network share anywhere on the server and set appropriate user permission.

That’s it … pretty simple ah … feel free to comment.

TextHelperButton = function(fieldId)
var fldButton = this;

fldButton.Field = crmForm.all[fieldId];

if (!fldButton.Field)
return alert("Unknown Field: " + fieldId);

fldButton.Click = null;
fldButton.Image = new ButtonImage();
fldButton.Paint = function()
var field_d = document.all[fldButton.Field.id + "_d"];
if (field_d)
field_d.style.whiteSpace = "nowrap";

fldButton.MouseOver = function()
event.srcElement.src = fldButton.Image.MouseOver;

fldButton.MouseOut = function()
event.srcElement.src = fldButton.Image.MouseOut;

function ButtonImage()
this.MouseOut = "/_imgs/lookupOff.gif";
this.MouseOver = "/_imgs/lookupOn.gif";
this.Width = 21

this.ToObject = function()
var img = document.createElement("IMG");
img.onmouseover = fldButton.MouseOver;
img.onmouseout = fldButton.MouseOut;
img.onclick = fldButton.Click;
img.src = this.MouseOut;

var cssText = "vertical-align:bottom;";
cssText+= "margin:1px;";
cssText+= "position:relative;";
cssText+= "right:" + (this.Width + 1) + "px";
img.style.cssText = cssText;
return img;

function OnCrmPageLoad()
/* Build the Avatar path attribute Text Helper Button */
var avaterBtn = new TextHelperButton("pager");
avaterBtn.Click = SelectAvatar;

/* Set the avatar IFRAME when the form loads*/
if (crmForm.all.pager.DataValue)
document.all.IFRAME_image.src = crmForm.all.pager.DataValue;

function SelectAvatar()
var dialog = new ActiveXObject("MSComDlg.CommonDialog");
/* You may set the filter to only show image files */
dialog.Filter = "All Files (*.*)";
/* Point the dialog to the current (selected) image */
dialog.FileName = document.all.IFRAME_image.src;
dialog.MaxFileSize = 1024;

/* Save the readonly path attribute with the new file selection */
crmForm.all.pager.DataValue = dialog.FileName;
/* Force submit since this is a readonly attribute */
crmForm.all.pager.ForceSubmit = true;
/* Update the image iframe */
document.all.IFRAME_image.src = crmForm.all.pager.DataValue;



Vladislav Osmanov said...

True KISS solution! : )

jani said...

Hi.. it luks pretty gud. i'm new to dynamics .. can you please let me know as to how u added the VB 6.0 common control open dialog to ur CRM form? it'l be of gr8 help.. thanks

Oracle Fusion said...

Thanks for the statistics. I discovered your blog very interesting; our java online training supplier won the high common place name through international for its coaching for more information please check the site.
Oracle Fusion HCM Technical Training

Blogger said...

In case you are interested in earning money from your websites/blogs via popup advertisments - you should run with one of the most established companies: PropellerAds.

Blogger said...

BlueHost is ultimately the best hosting company with plans for any hosting needs.

kirankumar said...

Thank you for blog posting information I liked it
Best Play and Pre School for kids in Hyderabad,India. To give your kid a best environment and learning it is the right way to join in play and pre school were kids can build there physically, emotionally and mentally skills developed. We provide programs to kids like Play Group, Nursery, Sanjary Junior, Sanjary Senior and Teacher training Program.
Preschool in hyderabad