[CLOSED] Managing events from a dynamically loaded UserControl

Hi there.
I am having troubles to achieve this: manage usercontrols events which are static (no generated in codebehind) but loaded dynamically.
I recreate the user control in the form (in the Page_Init event).
I am able to do that using the [AddToRecreation_Test] and the [js_putToCache] functions than I found in this forum.
No matter wich combination of properties I use (EnableViewstate=true, ViewStateMode=Enabled, both in ResourceManager, or controls, or Container; neither managing events as listeners or directevents, etc), can't achieve this.
As far now, my code can't preserve the checkbox state in postbacks and its event doesnt work properly.
Here is my example code:

Form html code:

Code:

---

<%@ Page Title="" Language="VB" MasterPageFile="~/MasterPages/PrincipalExt.master" AutoEventWireup="false" CodeFile="TestUserControl.aspx.vb" Inherits="Modulo_Solicitude_TestUserControl" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="phBody" Runat="Server">

    <ext:Button runat="server" ID="btnTest" Text="Push"></ext:Button>

    <ext:Button runat="server" ID="btnDelete" Text="Delete"></ext:Button>

    <ext:Container runat="server" ID="contContainer" EnableViewState="true"></ext:Container>

</asp:Content>

---

Form code-behind:

Code:

---

Imports Ext.Net

Partial Class Modulo_Solicitude_TestUserControl
    Inherits System.Web.UI.Page

    Protected Sub Page_Init(sender As Object, e As System.EventArgs) Handles Me.Init

        If Not Page.IsPostBack Then
            Me.Session.Remove("Recreation_Test")
        End If

        Dim ids As System.Collections.Generic.List(Of String) = Me.Session("Recreation_Test")

        If Not ids Is Nothing Then
            For Each id As String In ids

                ExtNet.Js.Call("js_destroyFromCache", New JRawValue(contContainer.ClientID))
                Dim uc1 As BaseUserControl = CType(Me.LoadControl("~/UserControl/Test1.ascx"), BaseUserControl)
                uc1.ID = id
                Me.contContainer.ContentControls.Add(uc1)

                ExtNet.Js.Call("js_putToCache", New JRawValue(contContainer.ClientID), uc1.ControlsToDestroy)
                Me.contContainer.UpdateContent()
            Next
        End If
    End Sub

    Private Sub AddToRecreation_Test(ByVal sControlId As String)
        Dim ids As System.Collections.Generic.List(Of String) = Me.Session("Recreation_Test")

        If ids Is Nothing Then
            ids = New System.Collections.Generic.List(Of String)
            Me.Session("Recreation_Test") = ids
        End If

        ids.Add(sControlId)
    End Sub

    Private Sub RemoveFromRecreation_Test(ByVal sControlId As String)
        Dim ids As System.Collections.Generic.List(Of String) = Me.Session("Recreation_Test")

        'TODO: mandar llamar a la función que eliminará el contacto
        'pero primero asegurarse si el ID es del tipo New o no
        '---

        If Not ids Is Nothing Then
            ids.Remove(sControlId)
        End If
    End Sub

    Protected Sub btnTest_DirectClick(sender As Object, e As Ext.Net.DirectEventArgs) Handles btnTest.DirectClick
        ExtNet.Js.Call("js_destroyFromCache", New JRawValue(contContainer.ClientID))

        Dim uc1 As BaseUserControl = CType(Me.LoadControl("~/UserControl/Test1.ascx"), BaseUserControl)
        uc1.ID = "UC1"
        Me.contContainer.ContentControls.Add(uc1)

        ExtNet.Js.Call("js_putToCache", New JRawValue(contContainer.ClientID), uc1.ControlsToDestroy)
        Me.contContainer.UpdateContent()

        Me.btnTest.Disabled = True
        Me.btnDelete.Disabled = False

        Me.AddToRecreation_Test(uc1.ID)
    End Sub

    Protected Sub btnDelete_DirectClick(sender As Object, e As Ext.Net.DirectEventArgs) Handles btnDelete.DirectClick
        ExtNet.Js.Call("js_destroyFromCache", New JRawValue(contContainer.ClientID))
        Me.RemoveFromRecreation_Test("UC1")

        Me.btnTest.Disabled = False
        Me.btnDelete.Disabled = True
    End Sub

    Protected Sub Page_Load(sender As Object, e As System.EventArgs) Handles Me.Load
        If Not IsPostBack Then
            Me.btnTest.Disabled = False
            Me.btnDelete.Disabled = True
        End If
    End Sub

End Class

---

Usercontrol html code:

Code:

---

<%@ Control Language="VB" AutoEventWireup="false" CodeFile="Test1.ascx.vb" Inherits="UserControl_Test1" %>


<ext:Label ID="Label1" runat="server" Text="I am User control №1" />
<br />
<ext:Button ID="Button1" runat="server" Text="User control №1: Ext.Net button">
</ext:Button>

<ext:Checkbox runat="server" ID="chkBox" BoxLabel="Check here" >
    <DirectEvents>
        <Check ViewStateMode="Enabled" OnEvent="Func"></Check>
    </DirectEvents>
</ext:Checkbox>

---

Usercontrol code-behind:

Code:

---

Imports System.Collections.Generic
Imports Gravitar.Neptune.Util
Imports Ext.Net

Partial Class UserControl_Test1
    Inherits BaseUserControl

    Public Overrides ReadOnly Property ControlsToDestroy() As System.Collections.Generic.List(Of String)
        Get
            Dim oList As New System.Collections.Generic.List(Of String)

            oList.Add(Me.chkBox.ClientID)
            oList.Add(Me.Label1.ClientID)
            oList.Add(Me.Button1.ClientID)

            Return oList
        End Get
    End Property

    <DirectMethod()> _
    Public Sub Func()
        Me.Button1.Disabled = True

    End Sub

    Protected Sub Button1_DirectClick(sender As Object, e As Ext.Net.DirectEventArgs) Handles Button1.DirectClick
        ExtMessageBox.ShowAlert("Title", "Body", "Okas")
    End Sub

    Protected Sub Page_Load(sender As Object, e As System.EventArgs) Handles Me.Load
        HttpContext.Current.Items("ExtNetParam_ReturnViewState") = True
    End Sub
End Class

---

Masterpage code:

Code:

---

<%@ Master Language="VB" CodeFile="PrincipalExt.master.vb" Inherits="MasterPages_PrincipalExt" %>
<%@ 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>
    <asp:ContentPlaceHolder id="head" runat="server">
    </asp:ContentPlaceHolder>



    <%--BEGIN - Estilos usados en ExtNet..................................................................... --%>
    <link href="../Common/css/ExtNet/Images.css" rel="stylesheet" type="text/css" />

    <link href="../Common/css/ExtNet/LiveSearch.css" rel="stylesheet" type="text/css" />

    <style type="text/css">
        .x-menu.x-menu-horizontal .x-menu-list
        {
            overflow: hidden;
        }
        .x-menu.x-menu-horizontal .x-menu-list .x-menu-list-item
        {
            float: left;
        }
        .x-menu.x-menu-horizontal .x-menu-list .x-menu-list-item .x-menu-item-arrow
        {
            background: none;
        }
    </style>

    <script type="text/javascript">
        var sTemplateColor = 'color:{0};';
        var sTemplateBold = 'font-weight:bold;';
        var sTemplateSpan = '<span style="{0}{1}">{2}</span>';

        var master_FormatStringSpan = function (sValue, bBold, sColor) {
            var sBoldString = '';
            var sColorString = '';
            var sReturn = '';


            if (bBold) {
                sBoldString = sTemplateBold;
                if (sColor != '')
                    sColorString = String.format(sTemplateColor, sColor);
            }
            else {
                sColorString = String.format(sTemplateColor, 'gray');
            }

            sReturn = String.format(sTemplateSpan, sBoldString, sColorString, sValue);

            return sReturn;
        };

    </script>

    <script type="text/javascript">
        var js_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 js_putToCache = function (container, controls) {
            container.controlsCache = controls;
        };
    </script>


    <%--END - Estilos usados en ExtNet..................................................................... --%>


</head>
<body>
    <form id="form1" runat="server">

        <ext:ResourceManager ID="ResourceManager1" runat="server" DirectMethodNamespace="CompanyX" />

        <div id="divPrincipal" runat="server" class="contenedorPrincipal base">
            <asp:ContentPlaceHolder ID="phBody" runat="server">

            </asp:ContentPlaceHolder>
        </div>
    </form>
</body>
</html>

---

Thanks in advanced.

Hi,

You should not call the UpdateContent method during Page_Init, so, please remove:

Code:

---

Me.contContainer.UpdateContent()

---

As well, please remove:

Code:

---

ExtNet.Js.Call("js_destroyFromCache", New JRawValue(contContainer.ClientID))

---

and

Code:

---

ExtNet.Js.Call("js_putToCache", New JRawValue(contContainer.ClientID), uc1.ControlsToDestroy)

---

It's all about the Page_Init code.

You will need these things if you would like to replace a user control with a new one during DirectEvent.

Quote:

---

Originally Posted by Daniil

It's all about the Page_Init code.
You will need these things if you would like to replace a user control with a new one during DirectEvent.

---

Thanks!
Now it is working.
Now I understand than the use of cache is not neccesary when we are recreating controls.
I will apply this example to ext:windows packaged in usercontrols.
One more thing: now I know than we need those functions when I need to replace a usercontrol with a new one, but
do I must call to [js_destroyFromCache] when I close the window or it will be destroyed automatically?
Thanks in advanced.

Well, by default a Window is hidden on Close button.

You should set up CloseAction="Close" for a Window, then a Window and its Items will be destroyed automatically. Only a Window and its Items.

If you use a Window Content (ContentControl), then you should destroy widgets manually.

Quote:

---

Originally Posted by Daniil

If you use a Window Content (ContentControl), then you should destroy widgets manually.

---

Oh, I see.
Thanks for the info.
I think this thread can be closed.