Copy link to clipboard
Copied
Good morning,
I have an application where I use cflayout type="tab" and in the CFLAYOUTAREA, i use iframes. This allows me to refresh the iframe without having to refresh the entire application. The problem is that with CF9, using iframes as the source for the various tabs does NOT work properly. When I select a tab, I have to right-click and refresh within the body of the tab to get the data.
Before refreshing, if I right-click print-preview, the preview displays the entire tab content properly; yet the tab is completely blank until I refresh the content of the tab.
This application worked properly in CF8 but does not work in CF9.
I need to use iFrames or something similar to display the data because I need to scroll through multiple records on a specific tab.
Any help would be appreciated.
Here is a sample - from the CF9 documentation that I modified to illustrate the problem. If you save both of these files as named and run them, you'll see that the tabs do NOT display properly and there is no text on Tab-1. If you right click within the white-space on Tab-1 and refresh, you'll see the text
Then, comment out the <iframe > </iframe> tags and un-comment the standard text below the <iframe> tag... and refresh the screen and you'll see the tabs display as expected.
----------------------------- UNTITLED-11.CFM --------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<cfajaximport tags="cflayout-tab, cfform">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body>
<h3>Atab</h3>
<cflayout type="tab" name="thelayout" tabheight="175" style="background-color:##CCffFF;color:red; height:200">
<cflayoutarea title="Tab 1" style="background-color:##FFAAFF;" closable="false">
<iframe src="Untitled-111.cfm"></iframe>
<!---This is text in layout area 1--->
</cflayoutarea>
<cflayoutarea name="area2" title="Tab 2" inithide="true" style="background-color:##FFCCFF" >
This is text in layout area 2
</cflayoutarea>
<cflayoutarea title="Tab 3" style="background-color:##FF99FF;">
This is text in layout area 3
</cflayoutarea>
</cflayout>
<br />
<br />
<cfform method="post" enctype="application/x-www-form-urlencoded" preloader="no">
<cfinput name="show" width="40" value="show tab" type="button" onClick="ColdFusion.Layout.showTab('thelayout', 'area2');">
<cfinput name="hide" width="40" value="hide tab" type="button" onClick="ColdFusion.Layout.hideTab('thelayout', 'area2');">
<cfinput name="enable" width="40" value="enable tab" type="button" onClick="ColdFusion.Layout.enableTab('thelayout', 'area2');">
<cfinput name="disable" width="40" value="disable tab" type="button" onClick="ColdFusion.Layout.disableTab('thelayout', 'area2');">
<cfinput name="select" width="40" value="select tab" type="button" onClick="ColdFusion.Layout.selectTab('thelayout', 'area2');">
</cfform>
</body>
</html>
---------------------------------------------------End UNTITLED-11.CFM ------------------------------------------------------
-------------------------------------------------- UNTITLED-111.CFM ---------------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<cfoutput>
This is the layout area for Tab 1.
</cfoutput>
</body>
</html>
-----------------------------------------------------End UNTITLED-111.cfm
Thanks,
Don.
Copy link to clipboard
Copied
Good afternoon,
Ok, I found the answer - Internet Explorer 8 (good ole Microsoft) decided to display my CF application in Compatibility mode. I turned that off and the Tabs with iFrames for source works. There is some minor tweaking I need to do to account for changes between CF 8 and CF 9, but it works.
Thanks,
Don.