IFrame, aspx inside flex

[raffialexanian]

Hi all;

My flex popup embeds an aspx page. This popup is triggered when the user click's a certain area in a map (ESRI map API for Flex). The first popup (parcelsPopUpWindow.mxml) is triggered when the click happens. The user then selects if he/she wants to add a listing in that area for either business or real estate. So the popup has a button for each option, clicking the button launches a second popup (OrdersPopUpWindow.mxml). This all happens fine only when I launch the application locally in IE. In all other browsers, the second popup doesn’t embed the aspx page. Strange thing is I can access both aspx pages (real estate and business) directly from all browsers, so it’s hard to emagine a permission issue here, can anyone please help?
Thanks
Raffi

parcelsPopUpWindow.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" title="Parcel Information"
fontWeight="normal"
borderColor="#970101" backgroundColor="#010000" cornerRadius="10" width="526" height="200" borderStyle="solid"
roundedBottomCorners="true" color="#E90D02" verticalScrollPolicy="auto" focusEnabled="true" activate="init();">
<mx:Style source="Voda_css.css"/>
<mx:HBox width="100%" height="20">
<mx:Label text="Parcel ID" width="100"/>
<mx:Text id="ParcelID" selectable="false" height="100%" textAlign="left" width="100%" color="#FFFFFF" fontWeight="bold"/>
</mx:HBox>
<mx:HBox width="100%" height="20">
<mx:Label text="X Coordinate" width="100"/>
<mx:Text id="xCo" selectable="false" height="100%" textAlign="left" width="100%" color="#FFFFFF" fontWeight="bold"/>
<mx:Label text="Y Coordinate" width="100"/><mx:Text id="yCo" selectable="false" height="100%" textAlign="left" width="100%" color="#FFFFFF" fontWeight="bold"/>
</mx:HBox>
<mx:HBox width="100%" height="20">
<mx:Label text="Sector" width="100"/>
<mx:Text id="SectorID" selectable="false" height="100%" textAlign="left" width="100%" color="#FFFFFF" fontWeight="bold"/>
<mx:Label text="City" width="100"/>
<mx:Text id="CityID" selectable="false" height="100%" textAlign="left" width="100%" color="#FFFFFF" fontWeight="bold"/>
</mx:HBox>

<mx:Metadata>
[Event(name="ok", type="flash.events.Event")]
</mx:Metadata>

<mx:Script>
<![CDATA[
import mx.managers.FocusManager;
import mx.core.Application;
import mx.managers.PopUpManager;
import mx.controls.Alert;
var xCoordinate:String;
var yCoordinate:String;
var ordersWindow:OrdersPopUpWindow;
var realWindow:OrdersPopUpWindow;

private function addBusinessShowPopUp():void
{
ordersWindow = new OrdersPopUpWindow();
PopUpManager.addPopUp(ordersWindow, this, true);
ordersWindow.addEventListener("ok",closeHandler );
ordersWindow.frame.source="http://www.digitaleg.com/DigitalEg/submitBusiness.aspx?Parcel="+ParcelID.text+"_"+SectorID.text+"_"+CityID.text+"_"+xCo.text+"_"+yCo.text;
ordersWindow.x=200;
ordersWindow.y=100;
}

private function addRealEstateShowPopUp():void
{
realWindow = new OrdersPopUpWindow();
PopUpManager.addPopUp(realWindow, this, true);
realWindow.frame.label = "Submit Real Estate";
realWindow.addEventListener("ok",closeHandler );
realWindow.frame.source="http://www.digitaleg.com/DigitalEg/submitRealEstate.aspx?Parcel="+ParcelID.text+"_"+SectorID.text+"_"+CityID.text+"_"+xCo.text+"_"+yCo.text;
realWindow.x=200;
realWindow.y=100;
}

private function closeHandler(event:Event):void
{
PopUpManager.removePopUp(ordersWindow);
PopUpManager.removePopUp(realWindow);
}


private function okClickHandler():void
{

var e:Event = new Event("OK");
dispatchEvent(e);
}
]]>
</mx:Script>

<mx:HBox width="100%" height="100%" verticalAlign="middle" horizontalAlign="center">
<mx:Button id="ook1" label="Add Real Estate" color="#FEFCFC" themeColor="#FF0006" styleName="largeWidthButton" buttonMode="true" focusEnabled="true" paddingTop="5" click="addRealEstateShowPopUp();"/>
<mx:Button id="ook0" label="Add Business" color="#FFFFFF" themeColor="#FF0006" styleName="largeWidthButton" buttonMode="true" focusEnabled="true" click="addBusinessShowPopUp();" paddingTop="5"/>
</mx:HBox>
<mx:ControlBar horizontalAlign="center">
<mx:Button id="ook" label="OK" color="#FEFEFE" themeColor="#FF0006" click="okClickHandler()" styleName="popUpQuickFind" buttonMode="true" focusEnabled="true" paddingTop="5"/>
</mx:ControlBar>
</mx:TitleWindow>



OrdersPopUpWindow.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:local="*" layout="vertical"
width="800" height="500"
verticalScrollPolicy="auto" focusEnabled="true" styleName="searchResults">
<mx:Style source="Voda_css.css"/>

<mx:TabNavigator id="tab" width="100%" height="100%">

<local:IFrame id="frame"
label="Submit Business"
source="http://www.digitaleg.com/DigitalEg/submitBusiness.aspx?Parcel=0_Generic_Generic"
width="100%" height="100%"
styleName="advancedDGrid" fontWeight="bold"/>

</mx:TabNavigator>
<mx:Metadata>
[Event(name="ok", type="flash.events.Event")]
</mx:Metadata>

<mx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.managers.PopUpManager;
private function okClickHandler():void
{

frame.visible=false;
var e:Event = new Event("ok");
dispatchEvent(e);
}
]]>

</mx:Script>
<mx:ControlBar horizontalAlign="center">
<mx:Button label="Close" color="#FEFEFE" themeColor="#FF0006" click="okClickHandler()" styleName="popUpQuickFind" buttonMode="true" focusEnabled="true"/>
</mx:ControlBar>
</mx:TitleWindow>

[raffialexanian]

Below is the source for one of the aspx pages:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="submitRealEstate.aspx.cs" Inherits="submitBusiness" %>

<!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 runat="server">
<title>Untitled Page</title>
<style type="text/css">
<!--
.style2 {color: #FFFFFF; font-family: Verdana, Arial, Helvetica, sans-serif; }
.style4 {
color: #FFFFFF;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}
.style8 {
color: #FFFFFF;
font-size: 12px;
}
.style9 {color: #FFFFFF}
table {
font-family: Verdana, Arial, Helvetica, sans-serif;

}
-->
</style>
</head>
<body bgcolor="#000000">
<form id="form1" runat="server">
<div>
<h3 align="center"class="style13">Submit your property</h3>
<h5 align="center" class="style2">Location Information - Automatically Created</h5>
<table width="100%" border="0" style="vertical-align: middle; text-align: left">


<tr>
<th scope="col" style="width: 50%"><div align="right"><span class="style12">Parcel ID</span></div></th>
<th scope="col">
<asp:Label ID="ParcelIDLabel" runat="server" ForeColor="Red" Font-Bold="False"></asp:Label>&nbsp;</th>
</tr>
<tr>
<th scope="col" style="width: 50%; text-align: right">
<span style="font-size: 9pt; color: #ffffff">Xcoordinate</span></th>
<th scope="col">
<asp:Label ID="xCoLabel" runat="server" Font-Bold="False" ForeColor="Red"></asp:Label></th>
</tr>
<tr>
<th scope="col" style="width: 50%; text-align: right">
<span style="font-size: 9pt; color: #ffffff">Ycoordinate</span></th>
<th scope="col">
<asp:Label ID="yCoLabel" runat="server" Font-Bold="False" ForeColor="Red"></asp:Label></th>
</tr>
<tr>
<th scope="row" style="width: width: 50%"><div align="right"><span class="style12">Sector</span></div></th>
<td><asp:Label ID="SectorLabel" runat="server" ForeColor="Red"></asp:Label></td>
</tr>
<tr>
<th height="23" scope="row" style="width: 50%"><div align="right"><span class="style12">City</span></div></th>
<td><asp:Label ID="CityLabel" runat="server" ForeColor="Red"></asp:Label></td>
</tr>
</table>
<h5 align="center" class="style2">About the Submitter</h5>
<table width="100% " border="0">
<tr>
<th scope="col" style="width: 50%"><div align="right"><span class="style8">First Name</span></div></th>
<th scope="col"><div align="left">
<asp:TextBox ID="FirstNameText" runat="server"></asp:TextBox>&nbsp;<asp:Label ID="Label4"
runat="server" ForeColor="Red" Text="*"></asp:Label></div></th>
</tr>
<tr>
<th scope="row" style="width: 50%"><div align="right"><span class="style8">Last Name</span></div></th>
<td>
<asp:TextBox ID="LastNameText" runat="server"></asp:TextBox>
<asp:Label ID="Label5" runat="server" ForeColor="Red" Text="*"></asp:Label></td>
</tr>
<tr>
<th scope="row" style="width: 50%"><div align="right"><span class="style8">Office Phone</span></div></th>
<td>
<asp:TextBox ID="OfficePhonetext" runat="server"></asp:TextBox>
<asp:Label ID="Label6" runat="server" ForeColor="Red" Text="*"></asp:Label>
</td>
</tr>
<tr>
<th scope="row" style="width: 50%"><div align="right"><span class="style8">Mobile Phone</span></div></th>
<td style="height: 26px">
<asp:TextBox ID="MobilePhoneText" runat="server"></asp:TextBox>
<asp:Label ID="Label7" runat="server" ForeColor="Red" Text="*"></asp:Label></td>
</tr>
<tr>
<th scope="row" style="width: 50%"><div align="right"><span class="style4">Email</span></div></th>
<td>
<asp:TextBox ID="EmailText" runat="server"></asp:TextBox>
<asp:Label ID="Label8" runat="server" ForeColor="Red" Text="*"></asp:Label></td>
</tr>
</table>
<h5 align="center" class="style2">About the Property</h5>
<table width="100% " border="0">
<tr>
<th scope="col" style="width: 50%"><div align="right" class="style8">Type</div></th>
<th scope="col">
<div align="left">
&nbsp;</div>

<div align="left">

<asp:DropDownList ID="TypeDropDownList" runat="server"
onselectedindexchanged="DropDownList1_SelectedIndexChanged" Width="170px">
<asp:ListItem>Apartment</asp:ListItem>
<asp:ListItem>Beach Chalet</asp:ListItem>
<asp:ListItem>Building</asp:ListItem>
<asp:ListItem>Land</asp:ListItem>
<asp:ListItem>Large Facility</asp:ListItem>
<asp:ListItem>Office</asp:ListItem>
<asp:ListItem>Pen House</asp:ListItem>
<asp:ListItem>Store</asp:ListItem>
<asp:ListItem>Villa</asp:ListItem>
</asp:DropDownList> <asp:Label ID="Label9" runat="server" ForeColor="Red" Text="*"></asp:Label>
</div>
</th>
</tr>

<tr>
<th scope="row" style="width: 50%"><div align="right" class="style8">Purpose</div></th>
<td>
<asp:DropDownList ID="PurposeDropDownList" runat="server" Width="170px">
<asp:ListItem>Rent</asp:ListItem>

<asp:ListItem>New Rent</asp:ListItem>
<asp:ListItem>Sale</asp:ListItem>

</asp:DropDownList><asp:Label ID="Label10" runat="server" ForeColor="Red" Text="*"></asp:Label></td>
</tr>

<tr>
<th scope="row" style="width: 50%" align="right" class="style8">Price</th>
<td>
<asp:TextBox ID="PriceTextBox" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<th scope="row" style="width: 50%"><div align="right"><span class="style8">Address</span></div></th>
<td>
<asp:TextBox ID="AddressText" runat="server"></asp:TextBox>
<asp:Label ID="Label11" runat="server" ForeColor="Red" Text="*"></asp:Label></td>
</tr>

<tr>
<th rowspan="3" scope="row" style="width: 50%">
<div align="right" class="style10"><span class="style9">Picture (Optional, maximum 3 files, jpg, gif or png files)</span></div>
</th>
<td>
<asp:FileUpload ID="FileUpload2" runat="server" />
<asp:Label ID="Label13" runat="server" ForeColor="Red" Text="*"></asp:Label></td>
</tr>
<tr>
<td>
<asp:FileUpload ID="FileUpload3" runat="server" />
<asp:Label ID="Label14" runat="server" ForeColor="Red" Text="*"></asp:Label></td>
</tr>
<tr>
<td>
<asp:FileUpload ID="FileUpload4" runat="server" />
<asp:Label ID="Label15" runat="server" ForeColor="Red" Text="*"></asp:Label></td>
</tr>
<tr>
<th scope="row" style="width: 50%"><div align="right"><span class="style4">Description</span></div></th>
<td style="height: 106px">
<asp:TextBox ID="DescText" runat="server" Height="100px" TextMode="MultiLine"
Width="230px"></asp:TextBox>
<asp:Label ID="Label16" runat="server" ForeColor="Red" Text="*"></asp:Label></td>
</tr>
</table>


<div align="center">
&nbsp;<br />
<asp:Button ID="Button1" runat="server" Text="Submit for Authorization" Width="399px" OnClick="Button1_Click" />
</div>
</div>
</form>

</body>
</html>

[raffialexanian]

And finally the C sharp code

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Data;
using System.Data.Sql;
using System.Data.SqlClient;


public partial class submitBusiness : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
try
{
String param = Request.Params["Parcel"].ToString();
ParcelIDLabel.Text = param.Split('_')[0];
SectorLabel.Text = param.Split('_')[1];
CityLabel.Text = param.Split('_')[2];
xCoLabel.Text = param.Split('_')[3];
yCoLabel.Text = param.Split('_')[4];

}
catch (Exception ex)
{
}
}
protected void Button1_Click(object sender, EventArgs e)
{
try
{
SqlConnection con = new SqlConnection("Data Source=SV2983;Initial Catalog=C:\\INETPUB\\WWWROOT\\DIGITALEG\\APP_DATA\ \DATABASE.MDF;Integrated Security=True");
SqlCommand command = new SqlCommand("Select MAX(submitID)+1 from Business");
command.Connection = con;
con.Open();
String folder = command.ExecuteScalar().ToString();
con.Close();

System.IO.Directory.CreateDirectory(@"D:\\Listing_Images\\Business\\" + folder);

if (FileUpload1.PostedFile != null)
{
FileUpload1.PostedFile.SaveAs("D:\\Listing_Images\\Business\\" + folder + "\\_logo.jpg");
}

if (FileUpload2.PostedFile != null)
{
FileUpload2.PostedFile.SaveAs("D:\\Listing_Images\\Business\\" + folder + "\\_image1.jpg");
}

if (FileUpload3.PostedFile != null)
{
FileUpload3.PostedFile.SaveAs("D:\\Listing_Images\\Business\\" + folder + "\\_image2.jpg");
}

if (FileUpload4.PostedFile != null)
{
FileUpload4.PostedFile.SaveAs("D:\\Listing_Images\\Business\\" + folder + "\\_image3.jpg");
}

String insertText = "INSERT INTO Business(ParcelID, SectorName, CityName, FirstName, LastName, OfficePhone, MobilePhone, Email, BusinessName, BusinessType, Address,Description, Xcoordinate, Ycoordinate) VALUES ('" +
ParcelIDLabel.Text + "','" + SectorLabel.Text + " ',' " + CityLabel.Text + "','" + FirstNameText.Text + "','" + LastNameText.Text + "','" + OfficePhonetext.Text + "','" + MobilePhoneText.Text + "','" + EmailText.Text + "','" + businessText.Text + "','" + BusinessTypeDropDownList.SelectedValue + "','" + AddressText.Text + "','" + DescText.Text + "','" + xCoLabel.Text + "','" + yCoLabel.Text + "')";

SqlConnection con2 = new SqlConnection("Data Source=SV2983;Initial Catalog=C:\\INETPUB\\WWWROOT\\DIGITALEG\\APP_DATA\ \DATABASE.MDF;Integrated Security=True");
SqlCommand com2 = new SqlCommand(insertText);
com2.Connection = con2;
con2.Open();
com2.ExecuteNonQuery();
con2.Close();

Response.Redirect("Sucess.aspx");
}
catch (Exception exception)
{
// Response.Redirect("Failed.aspx");
}
}
}

[raffialexanian]

This is the IFrame code. I HAD TO REMOVE ALL THE COMMENTS INCLUDING CREDITS FOR Alistair Rutherford, www.netthreads.co.uk CAUSE OF THE CODE LINE LIMITATION HERE.
package
{
import flash.geom.Point;
import flash.events.Event;
import flash.utils.Dictionary;
import flash.display.DisplayObjectContainer;

import mx.core.Container;
import mx.events.IndexChangedEvent;


import flash.external.ExternalInterface;

public class IFrame extends Container
{
private var __source: String;
private var frameId:String;
private var iframeId:String;

private var containerDict:Object = null;
private var settingDict:Object = null;

/**
* Here we define javascript functions which will be inserted into the DOM
*
*/
private static var FUNCTION_CREATEIFRAME:String =
"document.insertScript = function ()" +
"{ " +
"if (document.createIFrame==null)" +
"{" +
"createIFrame = function (frameID)" +
"{ " +
"var bodyID = document.getElementsByTagName(\"body\")[0];" +
"var newDiv = document.createElement('div');" +
"newDiv.id = frameID;" +
"newDiv.style.position ='absolute';" +
"newDiv.style.backgroundColor = 'transparent';" +
"newDiv.style.border = '0px';" +
"newDiv.style.visibility = 'hidden';" +
"bodyID.appendChild(newDiv);" +
"}" +
"}" +
"}";

private static var FUNCTION_MOVEIFRAME:String =
"document.insertScript = function ()" +
"{ " +
"if (document.moveIFrame==null)" +
"{" +
"moveIFrame = function(frameID, iframeID, x,y,w,h) " +
"{" +
"var frameRef=document.getElementById(frameID);" +
"frameRef.style.left=x;" +
"frameRef.style.top=y;" +
"var iFrameRef=document.getElementById(iframeID);" +
"iFrameRef.width=w;" +
"iFrameRef.height=h;" +
"}" +
"}" +
"}";

private static var FUNCTION_HIDEIFRAME:String =
"document.insertScript = function ()" +
"{ " +
"if (document.hideIFrame==null)" +
"{" +
"hideIFrame = function (frameID)" +
"{" +
"document.getElementById(frameID).style.visibility= 'hidden';" +
"}" +
"}" +
"}";

private static var FUNCTION_SHOWIFRAME:String =
"document.insertScript = function ()" +
"{ " +
"if (document.showIFrame==null)" +
"{" +
"showIFrame = function (frameID)" +
"{" +
"document.getElementById(frameID).style.visibility= 'visible';" +
"}" +
"}" +
"}";

private static var FUNCTION_LOADIFRAME:String =
"document.insertScript = function ()" +
"{ " +
"if (document.loadIFrame==null)" +
"{" +
"loadIFrame = function (frameID, iframeID, url)" +
"{" +
"document.getElementById(frameID).innerHTML = \"<iframe id='\"+iframeID+\"' src='\"+url+\"' frameborder='0'></iframe>\";" +
"}" +
"}" +
"}";

public function IFrame()
{
super();
}


override protected function createChildren():void
{
super.createChildren();

if (! ExternalInterface.available)
{
throw new Error("ExternalInterface is not available in this container. Internet Explorer ActiveX, Firefox, Mozilla 1.7.5 and greater, or other browsers that support NPRuntime are required.");
}

frameId = id;
iframeId = "iframe_"+frameId;

ExternalInterface.call(FUNCTION_CREATEIFRAME);
ExternalInterface.call(FUNCTION_MOVEIFRAME);
ExternalInterface.call(FUNCTION_HIDEIFRAME);
ExternalInterface.call(FUNCTION_SHOWIFRAME);
ExternalInterface.call(FUNCTION_LOADIFRAME);

ExternalInterface.call("createIFrame", frameId);

buildContainerList();
}

private function buildContainerList():void
{

containerDict = new Dictionary();
settingDict = new Dictionary();

var current:DisplayObjectContainer = parent;
var previous:DisplayObjectContainer = this;

while (current!=null)
{
if (current is Container)
{
if (current.contains(previous))
{
var childIndex:Number = current.getChildIndex(previous);

containerDict[current] = childIndex;
settingDict[current] = childIndex;

current.addEventListener(IndexChangedEvent.CHANGE, handleChange);

}

}

previous = current;
current = current.parent;
}

}

private function handleChange(event:Event):void
{
var target:Object = event.target;

if (event is IndexChangedEvent)
{
var changedEvent:IndexChangedEvent = IndexChangedEvent(event)

var newIndex:Number = changedEvent.newIndex;

visible = checkDisplay(target, newIndex);

}
}


private function checkDisplay(target:Object, newIndex:Number):Boolean
{
var valid:Boolean = false;

if (target is Container)
{
var container:DisplayObjectContainer = DisplayObjectContainer(target);
settingDict[container] = newIndex;

valid = true;

for (var item:Object in containerDict)
{
var index:Number = lookupIndex(item as Container);
var setting:Number = lookupSetting(item as Container);

valid = valid&&(index==setting);
}

}

return valid;
}


public function lookupIndex(target:Container):Number
{
var index:Number = -1;

try
{
index = containerDict[target];
}
catch (e:Error)
{

trace(e);
}

return index;
}

public function lookupSetting(target:Container):Number
{
var index:Number = -1;

try
{
index = settingDict[target];
}
catch (e:Error)
{

trace(e);
}

return index;
}

private function moveIFrame(): void
{

var localPt:Point = new Point(0, 0);
var globalPt:Point = this.localToGlobal(localPt);

ExternalInterface.call("moveIFrame", frameId, iframeId, globalPt.x, globalPt.y, this.width, this.height);
}

override protected function commitProperties():void
{
super.commitProperties();

if (source)
{
ExternalInterface.call("loadIFrame", frameId, iframeId, source);

invalidateDisplayList();
}
}

override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
{
super.updateDisplayList(unscaledWidth, unscaledHeight);

moveIFrame();
}

public function set source(source: String): void
{
if (source)
{
__source = source;

invalidateProperties();
}
}

public function get source(): String
{
return __source;
}

override public function set visible(visible: Boolean): void
{
super.visible=visible;

if (visible)
{
ExternalInterface.call("showIFrame", frameId);
}
else
{
ExternalInterface.call("hideIFrame", frameId);
}
}
}