Sunday 27 February 2011

Google Maps integration and print iframe

On Internet a few google map solutions can be found by other bloggers, I found the most praticle and simpler to implement here: http://a33ik.blogspot.com/2010/06/intergration-google-maps-v3-into.html

However the functionality works great, if you click print on CRM you get page not found, the reason being is because the code behind the google map integration is based on fetching data from the contact form and contruct that url onto the specfied TAB on the code, when the preview is loaded this url will not be constructed because is not being called on the OnLoad Event.

So there is a easy way to make the same effect on the print page, although this method is unsupported.

Insert the below code on the customprint file, you will find this file on your CRM directory, this solution can work with any other iFrame you may load in a tab.

<script type="text/javascript">
//does an initial check if the ID for the google map is set. (assuming you've used GoogleMap for the iframe)
if (document.getElementById('IFRAME_GoogleMap')) {

var url = "";
if (document.getElementById('address1_country_d') != null)
  url = document.getElementById('address1_country_d').innerHTML;

if (document.getElementById('address1_city_d') != null)
  url += (url == "" ? "" : ", ") + document.getElementById('address1_city_d').innerHTML;

if (document.getElementById('address1_postalcode_d') != null)
  url += (url == "" ? "" : ", ") + document.getElementById('address1_postalcode_d').innerHTML;

if (document.getElementById('address1_line1_d') != null)
  url += (url == "" ? "" : ", ") + document.getElementById('address1_line1_d').innerHTML;

if (document.getElementById('address1_line2_d') != null)
  url += (url == "" ? "" : ", ") + document.getElementById('address1_line2_d').innerHTML;

if (document.getElementById('address1_line3_d') != null)
  url += (url == "" ? "" : ", ") + document.getElementById('address1_line3_d').innerHTML;    
if (url != "")
{

  document.getElementById('IFRAME_GoogleMap').src= "/ISV/gmap/GoogleMap.html?address=" + url;
  document.getElementById('IFRAME_GoogleMap').style.height = "400px";
  document.getElementById('IFRAME_GoogleMap').style.width = "900px";

} else {
// If no data to pass to url, defaults to text only "No Results"
document.getElementById('IFRAME_GoogleMap_d').innerHTML= "No results";
}

}
</script>

The variables with _d are the variables used on the Print page, so what we doing is capturing this variables and again contructing the url to then change the existing iFrame source on the page and point it to the exact location.

Please feel free to ask questions or leave feedback.
Nuno

3 comments:

  1. I need to print iframe content. I am showing third party web application to IFrame. How can we print the content of the page opened/Shown. Any guidence will be very much helpfull.

    ReplyDelete
  2. Hi Nuno, i know this is an old post however this code doesn't work.

    In print preview, first thing it does it loads the customprint.aspx file which then fires your javascript. The rest of the document hasn't even loaded yet so it skips this whole thing in my case at least.

    It cannot find document.getElementById('IFRAME_GoogleMap') because in print preview it doesn't exist until the whole thing finishes loading.

    ReplyDelete
    Replies
    1. Hi TOMIA,
      Yes this is an old post and only applies to CRM4, I will have a look at CRM2011 and see if I can help, I'm assuming you using 2011 ?

      Delete