[CLOSED] Adding menu items with Ajax Event

Page 1 of 2 12 LastLast
  1. #1

    [CLOSED] Adding menu items with Ajax Event

    Hello,


    I'm following the below post:

    http://forums.ext.net/showthread.php?4635#post18204

    However my values are not static and according to a value I have to load the values of this button menu control again.

    How can I do that?

    Thanks,
    Gokce
    Last edited by geoffrey.mcgill; Jan 19, 2011 at 5:24 AM.
  2. #2

    RE: [CLOSED] Adding menu items with Ajax Event

    Hi Gokce,

    Please post a simplified .aspx sample demonstrating how you currently have the component configured.


    Geoffrey McGill
    Founder
  3. #3

    RE: [CLOSED] Adding menu items with Ajax Event

    Hello,

    Basically I'm doing the following. I have to repopulate the category menu according to the selected company. I can do it in the page load if the event's (SelectCompany_Click) AutoPostBack property is set to true. However is there any way to make in the ajax event without post back?

    Thanks,
    gokce

    <script type="text/javascript">
        var updateCategoryText=function(item,checked) {
            var text=[];
    
            item.parentMenu.items.each(function(item) {
                if(item.checked) {
                    text.push(item.text);
                }
            });
                    
            if(text.length==0) {
                <%= btnCategory.ClientID %>.setText("Select Categories");
            } else {
                <%= btnCategory.ClientID %>.setText(text.join(","));
            }
        };
    </script>
    
    <style type="text/css">
        .checked-button .x-btn-center{
            text-align:left !important;
        }
    </style>
    
    <ext:Store runat="server" ID="store1">
        <Reader>
            <ext:JsonReader>
                <Fields>
                    <ext:RecordField Name="clmn11" />
                </Fields>
            </ext:JsonReader>
        </Reader>
    </ext:Store>
       
    <ext:BorderLayout runat="server" ID="pageBorderLayout">
        <North MarginsSummary="0 5 5 5">
        <ext:Panel ID="searchPanel" runat="server" 
        Border="false" HideBorders="true" AutoHeight="true" BodyStyle="padding:5px;" Frame="true" Collapsible="true" 
        Title="Browse Company" Icon="Magnifier">
        <Body>
            <ext:Panel ID="searchOptionsPanel" runat="server" Border="false" HideBorders="true">
                <Body>
                    <ext:FormLayout ID="formSearchOptions" runat="server" LabelWidth="150">
                        <ext:Anchor>
                        <ext:MultiField runat="server" FieldLabel="Company Info">
                        <Fields>
                            <ext:TextField ID="txtCompanyHostId" runat="server" Width="200" Note="Company Id" />
                            <ext:TextField ID="txtCompanyStructureId" runat="server" Width="200" Note="Structure Id" />
                            <ext:LinkButton runat="server" Text="Select Company" AutoPostBack="true">
                                <AjaxEvents>
                                    <Click OnEvent="SelectCompany_Click" />
                                </AjaxEvents>
                            </ext:LinkButton>
                        </Fields>
                        </ext:MultiField>
                        </ext:Anchor>
                        <ext:Anchor>
                            <ext:MultiField runat="server" FieldLabel="Categories">
                            <Fields>
                                <ext:Button ID="btnCategory" runat="server" Text="Select Categories" MinWidth="200" CtCls="checked-button">
                                    <Menu>
                                        <ext:Menu ID="menuCategory" runat="server" Width="200">   
                                        </ext:Menu>
                                    </Menu>
                                </ext:Button>
                            </Fields>
                            </ext:MultiField>
                        </ext:Anchor>
                    </ext:FormLayout>
                </Body>
               <Buttons>
                    <ext:Button ID="btnSearch" runat="server" Text="Browse" Icon="Magnifier" CausesValidation="true" Type="Submit">
                        <AjaxEvents>
                            <Click OnEvent="Browse_OnClick">
                                <EventMask ShowMask="true" Msg="Loading ..." />
                            </Click>
                        </AjaxEvents>
                    </ext:Button>
                </Buttons>
            </ext:Panel>
        </Body>
        </ext:Panel>
        </North>
           
        <Center MarginsSummary="0 5 0 5">
            <ext:Panel ID="centerPanel" runat="server" Frame="true">
                <Body>
                
                    <ext:Accordion ID="centerAccordionLayout" runat="server">
                    
                        <ext:GridPanel runat="server" ID="grid1" StoreID="store1" Header="true" Title="Names" Collapsed="true" Icon="Group">
                            <ColumnModel runat="server" ID="listColumnModel1">
                                <Columns>
                                    <ext:Column ColumnID="clmn11" Header="clmn11" DataIndex="clmn11" />
                                </Columns>
                            </ColumnModel>
                        </ext:GridPanel>                                       
                    </ext:Accordion>
                
                </Body>
            </ext:Panel>
        </Center>
    </ext:BorderLayout>
    protected void Browse_OnClick(object sender, Coolite.Ext.Web.AjaxEventArgs e)
    {
        // some code
    }
    
    protected void SelectCompany_Click(object sender, AjaxEventArgs e)
    {
            menuCategory.Items.Clear();
            if (!string.IsNullOrEmpty(txtCompanyHostId.Text.Trim()))
            {
                System.Collections.Generic.List<Entity.CodeValue> categories = Data.Category.Get_HostIDsByCompanyHostID(txtCompanyHostId.Text.Trim(), txtCompanyStructureId.Text.Trim());
                foreach (Truvo.Web.ContentManagement.Entity.CodeValue category in categories)
                {
                    Coolite.Ext.Web.CheckMenuItem item = new Coolite.Ext.Web.CheckMenuItem();
                    item.Text = category.Description;
                    item.Checked = false;
                    item.CheckHandler = "updateCategoryText";
                    item.Width = new System.Web.UI.WebControls.Unit(200);
                    item.Attributes.Add("key", category.Code);
                    item.HideOnClick = false;
    
                    menuCategory.Items.Add(item);
                }
            }
    }
  4. #4

    RE: [CLOSED] Adding menu items with Ajax Event

    Hi,

    At this moment you can add new items via javascript only

         Button1.menu.add(new Ext.menu.CheckItem({
              text: 'text',
              checked: false,
              checkHandler: myHandler,
              width:200,
              hideOnClick: false
         }));
  5. #5

    RE: [CLOSED] Adding menu items with Ajax Event

    Just a quick note here... adding Menu items from code-behind during an AjaxEvent will be possible with the upcoming v1.0 release.

    Geoffrey McGill
    Founder
  6. #6

    RE: [CLOSED] Adding menu items with Ajax Event

    Thanks for information. I'd like to ask if you have a scheduled date for version 1.0? It's important for us to make a schedule in our applications for enhancements and improvements. Looking forward to hearing from you.
  7. #7
    Any news on this issue?
    I'm trying the same thing, adding the items but i can't see them in the menu.
    I've also tried using DataBind or Update methods on the menu control, but nothing.
    Thanks!
  8. #8
    Hi,

    Here is an example.

    Example
    <%@ Page Language="C#" %>
    
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    
    <script runat="server">
        protected void Add(object sender, DirectEventArgs e)
        {
            Ext.Net.MenuItem item = new Ext.Net.MenuItem()
            {
                Text = "Dynamic item",
                Icon = Icon.Add
            };
    
            this.Menu1.Items.Add(item);
            this.Menu1.UpdateContent();
        }
    </script>
    
    <!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>Ext.Net Example</title>
    </head>
    <body>
        <form runat="server">
        <ext:ResourceManager runat="server" />
        <ext:Button runat="server" Text="Menu">
            <Menu>
                <ext:Menu ID="Menu1" runat="server">
                    <Items>
                        <ext:MenuItem Text="Static item" Icon="Add" />
                    </Items>
                </ext:Menu>
            </Menu>
        </ext:Button>
        <ext:Button runat="server" Text="Add" OnDirectClick="Add" />
        </form>
    </body>
    </html>
  9. #9
    Thanks Daniil!

    Your example works, but if i try to add a checkmenuitem (not a menu item), with a checkHandler i get a javascript error.
  10. #10
    Please provide a sample.
Page 1 of 2 12 LastLast

Similar Threads

  1. Replies: 2
    Last Post: May 21, 2012, 9:25 AM
  2. Adding items to Menu from code behind
    By maephisto in forum 1.x Help
    Replies: 1
    Last Post: Apr 21, 2011, 8:36 AM
  3. Replies: 2
    Last Post: Dec 15, 2009, 2:54 PM
  4. Adding controls with an ajax event
    By Hagalaz in forum 1.x Help
    Replies: 1
    Last Post: Nov 22, 2009, 9:12 AM
  5. [CLOSED] CycleButton - adding menu items in code behind
    By Justin_Wignall in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Mar 17, 2009, 1:25 PM

Posting Permissions