Tag Archives: IFrame

How To – Series 4: How to make an Associated View IFrame Mandatory

Sometimes, we came across situations to make an Associated View IFrame to be mandatory. However, it is very easy to implement. There are two approaches. First one is, using Java Script to call a web service and check whether current record has at least one associated record. And the second approach is just check whether an IFrame which is used to display associated records has at least one record in it’s grid. The latter approach is very easy to implement and here we go:
1.       In the onSave event of crmForm, just check how many records the IFrame grid has
2.       If the count is less than one, cancel the Save event and alert the user
3.       Set the focus to the “Add Existing Button” of the crmGrid.
function ValidateIFrame()
{
if (crmForm.all.IFRAME_ MyIFrame.readyState == “complete”)
{
if (document.frames(“IFRAME_ MyIFrame”).document.all[‘crmGrid’].InnerGrid.NumberOfRecords < 1)
{
event.returnValue=false;
alert(“Please Select Records”);
var oaddexist=document.frames(‘IFRAME_ MyIFrame’).document.getElementById(‘<id of the add existing button>’);
if(oaddexist)
{
oaddexist.focus();
}
}
}
}
}
if(crmForm.all.IFRAME_MyIFrame)
{
ValidateIFrame();
}

Hope it helps…

Thanks
Vikranth P.

How To – Series 2: How to make Phone Number field as CTI integrable or make IFrame look alike Label on Crm Form

There are situations, where you want to display an IFrame which looks like label on crm form. These type of implementations sometimes targets to have CTI integrations with them. Here I want to share with you one of the approaches to implement that. Below is the screenshot of what actually I want to get finally:
Here I am displaying Business phone of the contact in an IFrame which looks like a label on the form.
1.       Create an HTML page with style properties set to as follows:
<html>
<body style=”background-color: #eaf3ff; font-size:0.7em; font-family:Tahoma, Verdana, Arial; font-style:normal”>
</body>
</html>
Here, I am setting background color of the HTML page to be default CRM form’s color(i.e. #eaf3ff), font size to 0.7em(em is preferable than px for IE) and font family to be CRM form’s default i.e Tahoma, Verdana, Arial. So that, our HTML form which will become source for the IFrame will look alike as Crm Fom.
2.       Deploy above HTML page to ISV folder(ISVContactSampleAppBusinessPhone.html).
3.       Create a Section in the crmForm with formatting properties as:
i.                    Layout:  Fixed-width Column
ii.                   Column Format: Two columns(1:1)
So that we can make our IFrame to occupy only one column in the crm form instead entire row.
4.       Create an IFrame and name it as IFRAME_MyBusinessPhone with the following properties
i.                     URL: ISVContactSampleAppBusinessPhone.html
ii.                   Label it as MyBusinessPhone and check it to display label on the form
iii.                  Select Number of rows as “1” and uncheck “Automatically expand to use available space” so that IFrame occupies only one row.
iv.                 Select scrolling as “Never” and uncheck to “Display Border”.
v.                   Add this IFrame to earlier created section.
5.       Go to form onLoad event and add following code:
if(crmForm.all.telephone1.DataValue!=null)
{
document.getElementById(‘IFRAME_MyBusinessPhone_d’).innerHTML='<div style=”margin-top:2px; margin-left:2px”>’+crmForm.all.telephone1.DataValue+'</div>’;
}
else
{
document.getElementById(‘IFRAME_ MyBusinessPhone _d’).innerHTML='<div style=”margin-top:2px; margin-left:2px”></div>’;
}
Here I am giving div style margin as 2px so that it will be in align with IFrame’s label.
Finally, a simple IFrame and a HTML page with few properties set to will make a Magic….!!!!!!