Apr 16, 2012, 3:42 AM
[CLOSED] Expand/Collapse of IFrame Panel
I have a collapsible panel in a south region that I use to load an IFrame/URL when an event event occurs in a control in the center panel (a rowSelect event in my app, a test button here).
When the south panel is collapsed, i want to expand it as well as load a new url.
The code below will reproduce an error I am seeing. It generally occurs after collapsing the expanded panel, or when clicking the test button when after panel has been collapsed manually.
I was able to make this example working w/test 2 by first adding the code: if(ps.iframe)ps.clearContent(); But in my app I am still having problems, plus this feels like I'm missing something.
How should this work?
BTW-You can also reproduce this in the Panels.DeferedLoading example if you put an Ext Panel in Child, and toggle the panel expansion.
-Randy
Main Page
When the south panel is collapsed, i want to expand it as well as load a new url.
The code below will reproduce an error I am seeing. It generally occurs after collapsing the expanded panel, or when clicking the test button when after panel has been collapsed manually.
I was able to make this example working w/test 2 by first adding the code: if(ps.iframe)ps.clearContent(); But in my app I am still having problems, plus this feels like I'm missing something.
How should this work?
BTW-You can also reproduce this in the Panels.DeferedLoading example if you put an Ext Panel in Child, and toggle the panel expansion.
-Randy
Main Page
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script type="text/C#" runat="server">
protected void Page_Init(object sender, EventArgs e)
{
this.Form.Controls.Add(new ResourceManager());
this.Form.Controls.Add(new Viewport {
Layout = "border",
Items = {
new Ext.Net.Panel {
ID = "pCenter",
Region = Region.Center,
Title = "Center",
Buttons = {
new Ext.Net.Button{
Text = "Test",
Listeners =
{ Click = { Fn = "onTest"}}
}
}
},
new Ext.Net.Panel {
ID = "pSouth",
Region = Region.South,
Collapsed = true,
Collapsible = true,
Title = "Details",
Height = 200
}
}
});
}
</script>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title>Ext.NET Example</title>
<script type="text/javascript">
var onTest = function()
{
var ps = Ext.getCmp('pSouth'),
ic = {
url : "Frame2.aspx?key=" + Ext.id(),
mode : 'iframe'
};
var test=2;
switch(test)
{
case 1 : // expand before
{
if(ps.collapsed)
ps.expand(true);
ps.loadIFrame( ic );
} break;
case 2 : // expand after
{
ps.loadIFrame( ic );
if(ps.collapsed)
ps.expand(true);
} break;
};
</script>
</head>
<body>
<form runat="server" />
</body>
</html><%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script type="text/C#" runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if(!X.IsAjaxRequest || IsPostBack)
{
string key = Request.Params["key"];
if(!string.IsNullOrEmpty(key)) {
dPanel.Html = "gotKey:" + key;
}
}
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title></title>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" ScriptMode="Debug" />
<ext:Panel runat="server" ID="dPanel" Title='Child Frame' Height='300' Width='400' />
</form>
</body>
</html>
