Jun 25, 2011, 7:19 PM
[CLOSED] Dynamic loaded user control height problem
The issue is when I load user control on runtime user control won't Stretch in height is any workaround to solved this issue?
Screenshots
this is aspx page code
and BaseUserControl
Screenshots
this is aspx page code
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default" %>
<%@ 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">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Test</title>
<script type="text/javascript">
var destroyFromCache = function (container) {
container.controlsCache = container.controlsCache || [];
Ext.each(container.controlsCache, function (controlId) {
var control = Ext.getCmp(controlId);
if (control && control.destroy) {
control.destroy();
}
});
};
var putToCache = function (container, controls) {
container.controlsCache = controls;
};
var filterTree = function (title, text) {
pnlMenuContent.setTitle(title);
var tree = menuItems;
tree.clearFilter();
if (Ext.isEmpty(text, false)) {
return;
}
var re = new RegExp(".*" + text + ".*", "i");
tree.filterBy(function (node) {
return re.test(node.id);
});
};
var clearFilter = function () {
var tree = menuItems;
tree.clearFilter();
tree.getRootNode().collapseChildNodes(true);
tree.getRootNode().ensureVisible();
};
</script>
</head>
<body>
<form id="form1" runat="server">
<ext:ResourceManager runat="server" id="ResourceManager 1" />
<ext:Viewport ID="ViewPort1" runat="server">
<Items>
<ext:BorderLayout ID="BorderLayout1" runat="server">
<West Collapsible="true" MinWidth="220" Split="true">
<ext:Panel ID="pnlMenuContent" runat="server" Width="220" Layout="VBoxLayout" Border="false"
Header="true" ClientIDMode="Static" Title="Workplace">
<LayoutConfig>
<ext:VBoxLayoutConfig Align="Stretch" />
</LayoutConfig>
<Items>
<ext:TreePanel ID="menuItems" runat="server" Width="220" AutoHeight="true" Border="false"
ClientIDMode="Static" Header="false" AutoScroll="true" RootVisible="false" UseArrows="true"
Flex="1">
<Root>
<ext:TreeNode Text="Tools" Expanded="true">
<Nodes>
<ext:TreeNode Text="Load Empty" NodeID="empty" />
<ext:TreeNode Text="Load Grid" NodeID="grid" />
</Nodes>
</ext:TreeNode>
</Root>
<DirectEvents>
<Click OnEvent="onMenuClick" DisableCaching="false">
<ExtraParams>
<ext:Parameter Name="cmd" Value="node.text" Mode="Raw" />
<ext:Parameter Name="cmd_id" Value="node.id" Mode="Raw" />
</ExtraParams>
</Click>
</DirectEvents>
</ext:TreePanel>
</Items>
</ext:Panel>
</West>
<Center>
<ext:Panel ID="MainPanel" runat="server" Title="Control" Layout="FitLayout" >
</ext:Panel>
</Center>
</ext:BorderLayout>
</Items>
</ext:Viewport>
</form>
</body>
</html>using System;
using System.Collections.Generic;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Ext.Net;
public partial class application_Default2 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void onMenuClick(object sender, DirectEventArgs e)
{
string strControlPath = "controls/empty.ascx";
string strControlID = e.ExtraParams["cmd_id"];
switch (e.ExtraParams["cmd_id"])
{
case "grid":
strControlPath = "controls/sales-leads.ascx";
break;
case "empty":
strControlPath = "controls/empty.ascx";
break;
}
/* Loading User Control */
X.Js.Call("destroyFromCache", new JRawValue(MainPanel.ClientID));
BaseUserControl uc1 = (BaseUserControl)this.LoadControl(strControlPath);
uc1.ID = String.Format("UC{0}", strControlID);
this.MainPanel.ContentControls.Add(uc1);
X.Js.Call("putToCache", new JRawValue(MainPanel.ClientID), uc1.ControlsToDestroy);
this.MainPanel.UpdateContent();
}
}<%@ Control Language="C#" AutoEventWireup="true" CodeFile="sales-leads.ascx.cs" Inherits="application_controls_sales_leads" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<ext:GridPanel MonitorResize="true"
ID="GridPanel1"
runat="server"
StripeRows="true"
Border="true"
AutoExpandColumn="EventString">
<TopBar>
<ext:Toolbar ID="Toolbar1" runat="server">
<Items>
<ext:DateField ID="DateField1" runat="server" />
<ext:DateField ID="DateField2" runat="server" />
<ext:Button ID="Button1" runat="server" />
</Items>
</ext:Toolbar>
</TopBar>
<Store>
<ext:Store ID="Store1" runat="server">
<Reader>
<ext:ArrayReader>
<Fields>
<ext:RecordField Name="EventLogId" />
<ext:RecordField Name="Timestamp" Type="Date" />
<ext:RecordField Name="TriggerId" />
<ext:RecordField Name="TriggerName" />
<ext:RecordField Name="EventType" />
<ext:RecordField Name="EventString" />
</Fields>
</ext:ArrayReader>
</Reader>
</ext:Store>
</Store>
<ColumnModel ID="ColumnModel1" runat="server">
<Columns>
<ext:Column DataIndex="EventLogId" Header="ID" Width="50" Hidden="true" />
<ext:DateColumn DataIndex="Timestamp" Header="Tid" Format="yyyy-MM-dd HH:mm" Width="100" />
<ext:Column DataIndex="TriggerName" Header="Aktör" />
<ext:Column DataIndex="EventType" Header="Typ" />
<ext:Column DataIndex="EventString" Header="Info" />
</Columns>
</ColumnModel>
</ext:GridPanel>using System;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class application_controls_sales_leads : BaseUserControl
{
protected void Page_Load(object sender, EventArgs e)
{
}
}<%@ Control Language="C#" AutoEventWireup="true" CodeFile="empty.ascx.cs" Inherits="controls_empty" %>
Empty Controland BaseUserControl
using System.Collections.Generic;
using System.Web.UI;
public class BaseUserControl : UserControl
{
public virtual List<string> ControlsToDestroy
{
get
{
// we should return none lazy controls only because lazy controls will be autodestroyed by parent container
return new List<string>();
}
}
}
Last edited by Daniil; Jun 27, 2011 at 9:33 AM.
Reason: [CLOSED]
Originally Posted by Daniil
