I've been trying to accomplish this for a while and it just struck me yesterday how to accomplish this task. I have done searches all over the internet looking for ways to email pages from my applications and finally I have done it!!! Every single site I looked at has always said "no, it can't be done". Even the most advanced sites I could find said "no, it can't be done". So here you go.
A little background before we get into the code:
I've been using frame-sets for my applications for some time. I like the security of passing all form data into an iframe rather than showing url variables in the browser window url. It just looks cleaner to me, and I use very sophisticated menu systems that I'd prefer not to have to re load after every mouse click in my applications. So I have an application that consists of three frames topHeader, leftMenu and mainFrame. In the mainFrame is where most of the reporting and drilling etc... regular work stuff... goes. The topHeader and leftMenu both contain more specific navigation and information related to getting around and knowing where you are within the scope of the application.
Quite a while ago I devised a method using the below script to print any open window in the mainFrame without all the menu system:
function printMainWindowFrame() {
if (window.mainFrame) {
window.mainFrame.print();
} else if (window.frames['mainFrame']) {
window.frames['mainFrame'].focus();
window.frames['mainFrame'].print();
} else if (document.frames) {
document.frames('mainFrame').focus();
document.frames('mainFrame').print();
} else if (document.mainFrame) {
document.mainFrame.focus();
document.mainFrame.print();
}
}
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
Select allOpen in new window
Using this same script I am able to grab the full innerHTML from the body of the document in the mainFrame page and send it to a javascript email function. But no matter what you do, the email that is launched comes over with all the html tags converted to text and viewable in the window. Not the desired result! But you can copy and paste everything in a window into an email and it copies properly, so I figured there has to be a way to accomplish this!
Here is what I came up with - in the index of my main application page where all the frames and menus are loaded; I created a hidden form with the fields from, subject and body. I then grab the title of the window that is open in mainFrame document.mainFrame.document.title and put that into the Subject line which in my form is called emailSubject. Then grab the innerHTML of the document.body and put it in the form field emailPageFormBody. Then submit the form to another page in a hidden frame so it doesn't take the open browser window anywhere else, a wa-la you've just emailed yourself a copy of the open report window!!!
My example if coldFusion - but you could use any email landing page in any language, perl, php, asp, C# - whatever!!!
Main Page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Title</title>
<!-- This is specific to my application --->
<!-- I have another set of scripts that size the frameset in my application based on the browser and available screen size --->
<style type="text/css">
<!--
#mainFrame {
position:absolute;
left:150px;
top:75px;
width:800px;
height:800px;
z-index:2;
}
-->
</style>
<script language="javascript">
function mailpage() {
if (window.mainFrame) {
var MainFrameDOM = window.mainFrame.document.body;
var MainFrameTitle = window.mainFrame.document.title;
} else if (window.frames['mainFrame']) {
var MainFrameDOM = window.frames['mainFrame'].document.body;
var MainFrameTitle = window.frames['mainFrame'].document.title;
} else if (document.frames) {
var MainFrameDOM = document.frames('mainFrame').document.body;
var MainFrameTitle = document.frames('mainFrame').document.title;
} else if (document.mainFrame) {
var MainFrameDOM = document.mainFrame.document.body;
var MainFrameTitle = document.mainFrame.document.title;
}
document.getElementById('emailSubject').value=MainFrameTitle;
document.getElementById('emailPageFormBody').value=MainFrameDOM.innerHTML;
document.getElementById('emailPageForm').submit();
}
</script>
</head>
<body>
<!-- this frame is sized when the initial page loads and is sized to fill most of the browser window -->
<!-- this is the frame I want to set as my email function but it could be any frame in the DOM -->
<iframe id="mainFrame" frameborder="0"></iframe>
<!-- almost all application functions, form inputs, reports, etc... all load in the mainFrame everywhere in my application so at any point the user can use the image button for the email function and it will email the existing DOM in the mainFrame as they see it by grabbing the DOM - placing the entire DOM in the form and then pass that variable to the email function where it will simply email the page to their email address as its stored in the ColdFusion session variables -->
<!-- In my application this is in a div that shows only when the mouse is over a specific place in the menu system but you can use any text or image -->
<a href="javascript:mailpage();"><img src="/images/icons/mail2_16x16.gif" align="middle" border="0" style="cursor:hand;" ></a>
<!-- This form is at the very bottom of my page but it could exist anywhere in the document: -->
<!-- The most important part of this form is that its setup as a multiprt/form data and the method is post -->
<form enctype="multipart/form-data" name="emailPageForm" id="emailPageForm" method="post" style="display:none;" action="emailPageForm.cfm" target="processing">
<input type="hidden" name="FromAddress" value="<cfif IsDefined("session.user_settings.c_email")><cfoutput>#session.user_settings.c_email#</cfoutput></cfif>">
<input type="hidden" name="emailSubject" id="emailSubject" value="">
<input type="hidden" name="emailBody" id="emailPageFormBody" value="">
</form>
<!-- this frame is hidden so that the form processing goes to a frame that is not displayed to the user -->
<iframe id="processing" name="processing" style="display:none;" frameborder="0" width="0" height="0"></iframe>
</body>
<!-- this is the coldFusion page emailPageForm.cfm -->
<!-- this could also be done using php mail code -->
<cfmail to="#FromAddress#" subject="Page Requested From DSN" from="user@domain.com" server="mail.domain.com" type="html" username="username" password="password">
<cfoutput>#emailBody#</cfoutput>
</cfmail>
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:
68:
Select allOpen in new window
