What's New?

[CLOSED] Problem rendering usercontrol within BorderLayout at runtime

  1. #1
    Sep 07, 2010, 10:39 AM

    [CLOSED] Problem rendering usercontrol within BorderLayout at runtime

    I have a scenario where I'm loading a webusercontrol (ParentControl.ascx) onto a webform (WebForm2.aspx) at runtime. ParentControl.ascx has a button contained within a panel. On the DirectEvent click of the button I'm calling a DirectMethod that will load another usercontrol inside the ParentControl panel. This is achieved by adding the ChildControl.ascx to the ParentControl.ascx ContentControls collection and then calling Render on the Panel. This seems to functionality currently however, if I change ParentControl.ascx to contain a BorderLayout and try to add ChildControl.ascx to one of the Panels, the control does not appear to load.
    Does anyone have any ideas?

    Below I've listed the entire working example and also the changes required to break the example. If I've not made my issues clear then please reply and I'll provide further details.


    Thanks,

    GavinR


    Working Example

    <%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm2.aspx.vb" Inherits="Horizon.AppServers.ContractorHelpdesk.WebForm2" %>
 
<%@ 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></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <ext:ResourceManager ID="rm" runat="server" />
 
        <ext:Viewport ID="vp" runat="server" Layout="Fit">
 
        </ext:Viewport>
    </div>
    </form>
</body>
</html>
    <%@ Control Language="vb" AutoEventWireup="false" CodeBehind="ParentControl.ascx.vb"
    Inherits="Horizon.AppServers.ContractorHelpdesk.ParentControl" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<ext:ResourceManagerProxy ID="rmp" runat="server" />
<ext:Panel ID="Panel1" runat="server" Height="300" Title="Title">
    <Items>
        <ext:Button ID="Button1" runat="server" Text="Submit">
            <DirectEvents>
                <Click OnEvent="Button_Click" />
            </DirectEvents>
        </ext:Button>
    </Items>
</ext:Panel>
    <%@ Control Language="vb" AutoEventWireup="false" CodeBehind="ChildControl.ascx.vb" Inherits="Horizon.AppServers.ContractorHelpdesk.ChildControl" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<ext:Button ID="Button1" runat="server" Text="Submit">
</ext:Button>

    Public Class WebForm2
    Inherits System.Web.UI.Page
 
    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        Me.vp.ContentControls.Add(LoadControl("ParentControl.ascx"))
    End Sub
End Class
    Public Class ParentControl
    Inherits System.Web.UI.UserControl
 
    <Ext.Net.DirectMethod()> _
    Protected Sub Button_Click(ByVal sender As Object, ByVal e As Ext.Net.DirectEventArgs)
        Panel1.ContentControls.Add(LoadControl("ChildControl.ascx"))
        Panel1.Render(Me)
    End Sub
End Class
    Breaking Change
    <%@ Control Language="vb" AutoEventWireup="false" CodeBehind="ParentControl.ascx.vb"
    Inherits="Horizon.AppServers.ContractorHelpdesk.ParentControl" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<ext:ResourceManagerProxy ID="rmp" runat="server" />
<%--<ext:Panel ID="Panel1" runat="server" Height="300" Title="Title">
    <Items>
        <ext:Button ID="Button1" runat="server" Text="Submit">
            <DirectEvents>
                <Click OnEvent="Button_Click" />
            </DirectEvents>
        </ext:Button>
    </Items>
</ext:Panel>--%>
<ext:Panel ID="Panel5" runat="server" Height="300" Title="Title">
    <Items>
    <ext:BorderLayout ID="BorderLayout1" runat="server">
    <West Collapsible="true" Split="true">
        <ext:Panel ID="Panel1" runat="server" Title="West" Width="175">
 
        </ext:Panel>
    </West>
    <Center>
        <ext:Panel ID="Panel2" runat="server" Title="Center">
        <Items>
 
        <ext:Button ID="Button1" runat="server" Text="Submit">
            <DirectEvents>
                <Click OnEvent="Button_Click" />
            </DirectEvents>
        </ext:Button>
        </Items>
        </ext:Panel>
    </Center>
    <East Collapsible="true" Split="true">
        <ext:Panel ID="Panel3" runat="server" Title="East" Width="175">
        </ext:Panel>
    </East>
    <South Collapsible="true" Split="true">
        <ext:Panel ID="Panel4" runat="server" Height="150" Title="South">
        </ext:Panel>
    </South>
</ext:BorderLayout>
    </Items>
</ext:Panel>
  2. #2
    Sep 07, 2010, 2:28 PM
    Hello!

    The first that I should say you don't use DirectMethod. It is invoked from JavaScript code.
    There is just a DirectEvent handler in your code.

    To get more information about using direct methods please follow the link
    https://examples1.ext.net/#/Events/D...hods/Overview/
  3. #3
    Sep 07, 2010, 3:08 PM
    I'm sorry Daniil, I don't follow your comments. Are you saying I shouldn't use DirectMethods or I haven't used DirectMethods?

    Thanks,

    GavinR
  4. #4
    Sep 07, 2010, 6:28 PM
    Hi,

    1. Remove Layout="Fit" from ViewPort
    2. Remove DirectMethod attribute for DirectEvent handler
    3. BorderLayout region cannot be rerendered because
    The regions of a BorderLayout are fixed at render time and thereafter, its child Components may not be removed or added. To add/remove Components within a BorderLayout, have them wrapped by an additional Container which is directly managed by the BorderLayout. If the region is to be collapsible, the Container used directly by the BorderLayout manager should be a Panel.
    Here is working sample

    Page
    <%@ Page Language="C#" %>
<%@ 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></title>
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            vp.ContentControls.Add(LoadControl("ParentControl.ascx"));
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <ext:ResourceManager ID="rm" runat="server" />
  
        <ext:Viewport ID="vp" runat="server">  
        </ext:Viewport>
    </div>
    </form>
</body>
</html>
    ParentControl
    <%@ Control Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<script runat="server">
    protected void Button_Click(object sender, Ext.Net.DirectEventArgs e)
    {
        Panel1.ContentControls.Add(LoadControl("ChildControl.ascx"));
        Panel1.Render();
    }
</script>

<ext:FitLayout runat="server">
    <Items>    
        <ext:Panel ID="Panel5" runat="server" Height="300" Title="Title">
            <Items>
                <ext:BorderLayout ID="BorderLayout1" runat="server">
                    <West Collapsible="true" Split="true">                        
                        <ext:Panel runat="server" Layout="Fit" Title="West" Width="175">
                            <Items>
                                <ext:Panel ID="Panel1" runat="server" Border="false" >
                                </ext:Panel>    
                            </Items>
                        </ext:Panel>                        
                    </West>
                    <Center>
                        <ext:Panel ID="Panel2" runat="server" Title="Center">
                            <Items>
                                <ext:Button ID="Button1" runat="server" Text="Submit">
                                    <DirectEvents>
                                        <Click OnEvent="Button_Click" />
                                    </DirectEvents>
                                </ext:Button>
                            </Items>
                        </ext:Panel>
                    </Center>
                    <East Collapsible="true" Split="true">
                        <ext:Panel ID="Panel3" runat="server" Title="East" Width="175">
                        </ext:Panel>
                    </East>
                    <South Collapsible="true" Split="true">
                        <ext:Panel ID="Panel4" runat="server" Height="150" Title="South">
                        </ext:Panel>
                    </South>
                </ext:BorderLayout>
            </Items>
        </ext:Panel>
    </Items>
</ext:FitLayout>
    ChildControl
    <%@ Control Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<ext:Button ID="Button1" runat="server" Text="Submit">
</ext:Button>
  5. #5
    Sep 07, 2010, 8:44 PM
    Quote Originally Posted by GavinR View Post
    I'm sorry Daniil, I don't follow your comments. Are you saying I shouldn't use DirectMethods or I haven't used DirectMethods?

    Thanks,

    GavinR
    I apologise if the comment was not clear. I mean there is using DirectEvent handler in your code, not DirectMethod.
    Last edited by Daniil; Sep 08, 2010 at 9:23 AM.
  6. #6
    Sep 08, 2010, 9:14 AM
    Thanks to both of you for the help. This is now functioning correctly.

    GavinR

Similar Threads

  1. regarding usercontrol load in runtime
    By ranjit2k99 in forum 1.x Help
    Replies: 22
    Last Post: May 30, 2011, 1:38 PM
  2. [CLOSED] Rendering of GridPanel inside BorderLayout
    By martin.mosimann in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Apr 08, 2011, 4:25 PM
  3. [CLOSED] Rendering Problem: UserControl in a TabPanel in a Window
    By reto.ruemmeli in forum 1.x Legacy Premium Help
    Replies: 7
    Last Post: May 24, 2010, 7:57 AM
  4. [CLOSED] [1.0] Usercontrol Rendering
    By state in forum 1.x Legacy Premium Help
    Replies: 6
    Last Post: Nov 02, 2009, 3:19 PM
  5. BorderLayout in TabPanel not rendering
    By Washburn in forum 1.x Help
    Replies: 7
    Last Post: May 10, 2009, 8:27 PM

Tags for this Thread

Posting Permissions