[CLOSED] User Control (ascx) in a Window

**sisa** · Mar 21, 2013, 7:52 AM

Good morning all

Is it possible to show a User Control in a Window ? Do I need to wrap the control in a panel first ?

Regards
Peter

**Daniil** · Mar 21, 2013, 10:22 AM

Hello Peter,

It is not required to wrap. There are two approaches.

Example 1

<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<%@ Register Src="~/TestUC.ascx" TagPrefix="uc" TagName="TestUC" %>

<html>
<head runat="server">
    <title>Ext.NET v2 Example</title>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager runat="server" />
        <ext:Window runat="server" Layout="FitLayout">
            <Content>
                <uc:TestUC runat="server" />
            </Content>
        </ext:Window>
    </form>
</body>
</html>

Example 2

<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<html>
<head runat="server">
    <title>Ext.NET v2 Example</title>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager runat="server" />
        <ext:Window runat="server" Layout="FitLayout">
            <Items>
                <ext:UserControlLoader runat="server" Path="TestUC.ascx" />
            </Items>
        </ext:Window>
    </form>
</body>
</html>

Example User Control

<%@ Control Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<ext:Container runat="server" StyleSpec="background-color: green;" />

**sisa** · Mar 21, 2013, 12:30 PM

Originally Posted by Daniil

Hello Peter,

It is not required to wrap. There are two approaches.

Example 1

<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<%@ Register Src="~/TestUC.ascx" TagPrefix="uc" TagName="TestUC" %>

<html>
<head runat="server">
    <title>Ext.NET v2 Example</title>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager runat="server" />
        <ext:Window runat="server" Layout="FitLayout">
            <Content>
                <uc:TestUC runat="server" />
            </Content>
        </ext:Window>
    </form>
</body>
</html>

Example 2

<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<html>
<head runat="server">
    <title>Ext.NET v2 Example</title>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager runat="server" />
        <ext:Window runat="server" Layout="FitLayout">
            <Items>
                <ext:UserControlLoader runat="server" Path="TestUC.ascx" />
            </Items>
        </ext:Window>
    </form>
</body>
</html>

Example User Control

<%@ Control Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<ext:Container runat="server" StyleSpec="background-color: green;" />

I try it in codebehind with following code, but the usercontrol will not be rendered into the window
the window works with loadCentent("url")

 With ContactSearchWindow
   Dim ul As New Ext.Net.UserControlLoader
   ul.Path = String.Format("../userControls/Declaration/DeclarationGrid.ascx")
   .Items.Add(ul)
   .Icon = Icon.Page
   .Title = "todo"
   .LoadContent()
   .Hidden = False
  End With

thanks for help

**Daniil** · Mar 21, 2013, 12:43 PM

Please provide a full sample how you are trying without the LoadContent call.

**sisa** · Mar 26, 2013, 9:37 AM

Originally Posted by Daniil

Please provide a full sample how you are trying without the LoadContent call.

Here is my example:

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="LoadUserControl.aspx.vb" Inherits="TestApplikation.LoadUserControl" %>
<%@ Import Namespace="TestApplikation" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
    
    
    Private contactWindow As Ext.Net.Window = Nothing
    
    Protected ReadOnly Property ContactSearchWindow As Ext.Net.Window
        Get
            If contactWindow Is Nothing Then
                contactWindow = New Ext.Net.Window
                With contactWindow
                    .ID = "Contact"
                    .Hidden = True
                    .Closable = True
                    .Resizable = False
                    Dim t As New Ext.Net.ComponentLoader
                    t.Mode = Ext.Net.LoadMode.Frame
                    .Loader = t
                    .Width = Unit.Pixel(1120)
                    .Height = Unit.Pixel(544)
                    .PageX = 40
                    .PageY = 40
                    .Title = "hhhhhhhh"
                End With
            End If
            Return contactWindow
        End Get
    End Property
    
    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        
        ' If Not IsPostBack And Not ExtNet.IsAjaxRequest Then
        Me.Controls.Add(ContactSearchWindow)
        'End If
      
    End Sub
    
    <DirectMethod()>
    Public Sub cmdShow(ByVal sender As Object, ByVal e As DirectEventArgs)
        With ContactSearchWindow
            Dim ul As New Ext.Net.UserControlLoader
            ul.Path = String.Format("ElkeUserControl.ascx")
            Dim con As ElkeUserControl = CType(ul.UserControls(0), ElkeUserControl)
            con.QueryParameter = "baseQuery"
            .Items.Add(ul)
            '  .LoadContent()
            .Icon = Icon.Page
            .Title = "todo"
            .Hidden = False
        End With
    End Sub
    
    
</script>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <ext:ResourceManager ID="ResourceManager1" runat="server" />
        <div>
            <ext:Button ID="Button" runat="server" Text="Click">
                <DirectEvents>
                    <Click OnEvent="cmdShow">
                        <ext:EventMask ShowMask="true" />
                    </Click>
                </DirectEvents>
            </ext:Button>
        </div>
    </form>
</body>
</html>

and the UserControl

<%@ Control Language="vb" AutoEventWireup="false" CodeBehind="ElkeUserControl.ascx.vb" Inherits="TestApplikation.ElkeUserControl" %>
<ext:Container ID="Container1" runat="server" Layout="FitLayout">
 <Items>
        <ext:Label runat="server"  id="Test" Text="Hallo Elke"></ext:Label>
 </Items>
    </ext:Container>

Thanks for your help

**Daniil** · Mar 26, 2013, 11:38 AM

You should not use Loader and Items at the same time.

You specified the Loader to load some URL into a Window's as an iframe and, at the same time, you put the UserControlLoader into the Window's Items.

I am not sure what exactly you need to be in the Window.

Also it is incorrect to put a Window into the Page's Controls.

Me.Controls.Add(ContactSearchWindow)

It renders the Window outside the html tag.

Please put it into a form.

**sisa** · Mar 26, 2013, 1:30 PM

Originally Posted by Daniil

You should not use Loader and Items at the same time.

You specified the Loader to load some URL into a Window's as an iframe and, at the same time, you put the UserControlLoader into the Window's Items.

I am not sure what exactly you need to be in the Window.

Also it is incorrect to put a Window into the Page's Controls.

Me.Controls.Add(ContactSearchWindow)

It renders the Window outside the html tag.

Please put it into a form.

Hi Daniil,

you have given us two examples to load a Usercontrol.ascx into a Window.
The examples are in Markup. But I want to do it in Code Behind.

On my Page I have a Button and after the directmethod "click" a window should be opened. Inside the Window the usercontrol should be shown.

I have tested, putting the the Window in a form and eleminate the loader I havew the same result.

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        
        Me.form1.Controls.Add(ContactSearchWindow)
     
    End Sub

Thanks.

**Daniil** · Mar 26, 2013, 3:35 PM

Well, to load the Window's Content on the fly, I would still suggest to use a Loader.

Example Page

<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<script runat="server">
    [DirectMethod]
    public string Load()
    {
        return ComponentLoader.ToConfig("Test.ascx");
    }
</script>

<!DOCTYPE html>

<html>
<head runat="server">
    <title>Ext.NET v2 Example</title>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager runat="server" />

        <ext:Window ID="Window1" runat="server">
            <Loader 
                runat="server" 
                Mode="Component" 
                AutoLoad="false" 
                DirectMethod="#{DirectMethods}.Load" />
        </ext:Window>

        <ext:Button runat="server" Text="Load" Handler="App.Window1.load();" />
    </form>
</body>
</html>

Example User Control

<%@ Control Language="C#" %>

<ext:Label runat="server" Text="Hello, Elke!" />

**sisa** · Mar 27, 2013, 9:14 AM

Originally Posted by Daniil

Well, to load the Window's Content on the fly, I would still suggest to use a Loader.

Example Page

<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<script runat="server">
    [DirectMethod]
    public string Load()
    {
        return ComponentLoader.ToConfig("Test.ascx");
    }
</script>

<!DOCTYPE html>

<html>
<head runat="server">
    <title>Ext.NET v2 Example</title>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager runat="server" />

        <ext:Window ID="Window1" runat="server">
            <Loader 
                runat="server" 
                Mode="Component" 
                AutoLoad="false" 
                DirectMethod="#{DirectMethods}.Load" />
        </ext:Window>

        <ext:Button runat="server" Text="Load" Handler="App.Window1.load();" />
    </form>
</body>
</html>

Example User Control

<%@ Control Language="C#" %>

<ext:Label runat="server" Text="Hello, Elke!" />

Hi Daniil,

thanks for your example.
It doesn't work in vb.net. I get an exception.

Zeitstempel: 27.03.2013 10:06:32
Fehler: TypeError: App.Window1.Loadx is not a function
Quelldatei: http://localhost:59574/LoadUserControl.aspx
Zeile: 16
    <script type="text/javascript">
    //<![CDATA[
        Ext.net.ResourceMgr.init({id:"ResourceManager1",aspForm:"form1",theme:"gray"});Ext.onReady(function(){Ext.ns("App.direct");Ext.apply(App.direct, { Loadx:function(config){return Ext.net.DirectMethod.request("Loadx",Ext.applyIf(config || {}, {}));} });Ext.create("Ext.window.Window",{id:"Window1",hidden:false,loader:{id:"Loader1",autoLoad:false,renderer:"component",directMethod:"App.direct.Loadx"},renderTo:Ext.get("form1"),width:200});Ext.create("Ext.button.Button",{id:"Button",renderTo:"App.Button_Container",handler:function(){App.Window1.Loadx();},text:"Click"});});
    //]]>
    </script>

In C# it works.

**Vladimir** · Mar 27, 2013, 9:39 AM

What is 'Loadx'? Window has no such method, you have to use 'load' like in Daniil example

Thread: [CLOSED] User Control (ascx) in a Window

Thread Tools

Search Thread

Display

[CLOSED] User Control (ascx) in a Window

Similar Threads

Dynamically loading User Control inside User Control - Microsoft JScript runtime error: Expected ';'

[CLOSED] how to show Ext.Window in a user control on client side?

Window and User Control

[CLOSED] Problem trying to load a combo-user-control inside a window-user-control.

Show Modal window from a User Control

Posting Permissions

Sitemap

Downloads

Resources

Thread: [CLOSED] User Control (ascx) in a Window

[CLOSED] User Control (ascx) in a Window

Similar Threads

Posting Permissions

Sitemap

Downloads

Resources

Stay connected with us