What's New?

[CLOSED] Using an ascx user-defined control inside a menu button.

  1. #1
    Jan 14, 2013, 9:26 PM

    [CLOSED] Using an ascx user-defined control inside a menu button.

    First, here's my little snippet of code:

                                        <ext:Button ID="QuickLaunchReport" runat="server" ToolTip="Report Quick Launch" IconCls="icon-report_new">
                                        <Menu>
                                            <ext:Menu ID="QuickLaunchReportMenu" runat="server">
                                                <Content>
                                                    <uc:QuickSearch ID="QuickSearch" runat="server" />
                                                </Content>
                                            </ext:Menu>
                                        </Menu>
                                    </ext:Button>
    As you can see, I've placed an ascx control inside a menu button. This control contains a combo box which allows the user to select from a list of items.

    The problem is, after the user selects an item in the combo box, the list is destroyed on the page and when the eventhandler for the control is called, the selecteditem is always null or empty.

    Am I missing something in the way that controls can be used within menu buttons?

    Any help is greatly appreciated.

    Rick
    Last edited by Baidaly; Jan 16, 2013 at 1:18 AM. Reason: [CLOSED]
  2. #2
    Jan 15, 2013, 2:18 AM
    Hello!

    I don't quite understand your problem. I've tried following example and it works fine:

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

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

<%@ Register src="ucA.ascx" tagname="ucA" tagprefix="uc" %>

<!DOCTYPE html>

<html>
<head runat="server">
    <title>Ext.NET Examples</title>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager runat="server" SourceFormatting="True"  />
        
        <ext:Button ID="QuickLaunchReport" runat="server" Text="Button" ToolTip="Report Quick Launch" IconCls="icon-report_new">
            <Menu>
                <ext:Menu ID="QuickLaunchReportMenu" runat="server" AllowOtherMenus="True">
                    <Content>
                        <uc:ucA ID="QuickSearch" runat="server" />
                    </Content>
                </ext:Menu>
            </Menu>
        </ext:Button>
        
        <ext:Button runat="server" Text="Get selected value">
            <Listeners>
                <Click Handler="alert(QuickSearch_ComboBox1.getValue())"></Click>
            </Listeners>
        </ext:Button>
    </form>
</body>
</html>
    ASCX:

    <%@ Control Language="C#" AutoEventWireup="true"  %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        this.Store1.DataSource = new object[]
        {
            new object[] { "AL", "Alabama", "The Heart of Dixie" },
            new object[] { "AK", "Alaska", "The Land of the Midnight Sun" },
            new object[] { "AZ", "Arizona", "The Grand Canyon State" },
            new object[] { "AR", "Arkansas", "The Natural State" },
            new object[] { "CA", "California", "The Golden State" },
            new object[] { "CO", "Colorado", "The Mountain State" },
            new object[] { "CT", "Connecticut", "The Constitution State" },
            new object[] { "DE", "Delaware", "The First State" }
        };
        
        this.Store1.DataBind();
        
    }
</script>

    <ext:Store ID="Store1" runat="server">
        <Reader>
            <ext:ArrayReader>
                <Fields>
                    <ext:RecordField Name="abbr" />
                    <ext:RecordField Name="state" />
                    <ext:RecordField Name="nick" />
                </Fields>
            </ext:ArrayReader>
        </Reader>            
    </ext:Store>
    <ext:ComboBox 
                ID="ComboBox1" 
                runat="server" 
                StoreID="Store1" 
                Editable="false" 
                DisplayField="state"
                ValueField="abbr"
                TypeAhead="true" 
                Mode="Local"
                ForceSelection="true"
                EmptyText="Select a state..."
                Resizable="true"
                SelectOnFocus="true"
                />
  3. #3
    Jan 15, 2013, 5:14 AM
    Hi everybody,

    Personally, I would use this structure:

    Menu => Items => ComponentMenuItem => Component => Container => Content => User Control
  4. #4
    Jan 15, 2013, 2:24 PM

    Try again using my code sample...

    This is the ascx page (TestUserControl.ascx):
    <%@ Control Language="vb" %>


<script runat="server">
    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        If Not ExtNet.IsAjaxRequest Then
            Dim data As New List(Of Object)
            With data
                .Add(New With {
                     .url = "http://www.yahoo.com",
                     .desc = "Yahoo"})
                .Add(New With {
                     .url = "http://www.google.com",
                     .desc = "Google"})
            End With
            Store1.DataSource = data
            Store1.DataBind()
        End If
    End Sub
    
    Public Sub Results_Select(ByVal sender As Object, ByVal e As Ext.Net.DirectEventArgs)
        If String.IsNullOrEmpty(LaunchComboBox.SelectedItem.Value) Then Exit Sub
        Response.Redirect(LaunchComboBox.SelectedItem.Value)
    End Sub

</script>

<ext:Store ID="Store1" runat="server">
    <Reader>
        <ext:JsonReader IDProperty="url">
            <Fields>
                <ext:RecordField Name="url" Type="String" />
                <ext:RecordField Name="desc" Type="String" />
            </Fields>
        </ext:JsonReader>
    </Reader>
</ext:Store>
<ext:ComboBox 
    ID="LaunchComboBox" 
    runat="server"
    StoreID="Store1" 
    Editable="false" 
    DisplayField="desc" 
    ValueField="url" 
    TypeAhead="true" 
    Mode="Local" 
    EmptyText="Select a url..." 
    SelectOnFocus="true">
            <DirectEvents>
                <Select OnEvent="Results_Select" />
            </DirectEvents>
</ext:ComboBox>
    And this is the page containing the control (TestPage.aspx):

    <%@ Page Language="vb" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<%@ Register TagPrefix="uc" TagName="QuickLaunch" Src="~/TestUserControl.ascx" %>

<!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 id="Head1" runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <ext:ResourceManager ID="ResourceManagerControl" runat="server" />
    <ext:Panel ID="Panel1" runat="server">
        <TopBar>
            <ext:Toolbar runat="server">
                <Items>
                    <ext:Button ID="LaunchButton" runat="server" Icon="WorldGo">
                        <Menu>
                            <ext:Menu runat="server">
                                <Content>
                                    <uc:QuickLaunch ID="QuickLaunch" runat="server" />
                                </Content>
                            </ext:Menu>
                        </Menu>
                    </ext:Button>
                </Items>
            </ext:Toolbar>
        </TopBar>

    </ext:Panel>
    </form>
</body>
</html>
    If you place a breakpoint on the Results_Select subroutine, you will see that there is nothing in the combo box's selecteditem.value property.

    Rick
  5. #5
    Jan 15, 2013, 3:38 PM
    Because of a Menu is rendered out of a <form>.

    So, the ComboBox as a part of the Menu is also rendered out of the <form> and, respectively, not submitted automatically.

    You can set up RenderToForm="true" for the Menu to get it rendered to the <form>.
  6. #6
    Jan 15, 2013, 5:11 PM
    That did it! Thanks!

Similar Threads

  1. How setting TextField control inside childpage (.ascx) from parent page (.aspx)
    By teamsar in forum 2.x Help
    Replies: 0
    Last Post: Jan 11, 2013, 1:57 AM
  2. How to Access Parent Page (.aspx) control (IDs) from its child User Control (.ascx or .aspx) ?
    By hamaz in forum 1.x Help
    Replies: 2
    Last Post: Nov 15, 2012, 12:52 AM
  3. [CLOSED] Problem trying to load a combo-user-control inside a window-user-control.
    By egvt in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Feb 06, 2012, 9:06 AM
  4. Create control user with menu button
    By vincent in forum 1.x Help
    Replies: 0
    Last Post: Jan 11, 2011, 10:12 AM
  5. [CLOSED] How to make web user control (ascx) appear as an ext control
    By jmcantrell in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Aug 11, 2010, 9:23 AM

Posting Permissions