[CLOSED] Howto create menuitem or no menuitem with ternary operator

  1. #1

    [CLOSED] Howto create menuitem or no menuitem with ternary operator

    Hi

    Is there a way that I can create menu items depending on a ternary operator (or something similar)? (see code example: third submenu item)

    thank you very much.

    best regards

    <%@ Page Language="C#" %>
    
    <%@ Import Namespace="Menu=Ext.Net.Menu" %>
    <%@ Import Namespace="MenuItem=Ext.Net.MenuItem" %>
    
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            var menu = new Menu
            {
                Items = { 
                    new MenuItem { Text = "Item 1" },
                    new MenuItem { 
                        Text = "Item 2",
                        Menu = {
                            new Menu {
                                Items = {
                                    new MenuItem { Text = "Item 2.1" },
                                    new MenuItem { Text = "Item 2.2" },
                                    (false ? new MenuItem { Text = "Item 2.3" } : "no menu item needed" )
                                }
                            }
                        }
                    },
                    new MenuItem { Text = "Item 1" }
                }
            };
    
            this.Button1.Menu.Add(menu);
        }
    </script>
    
    <!DOCTYPE html>
      
    <html>
    <head runat="server">
        <title>Ext.NET Examples</title>
    </head>
    <body>
        <form runat="server">
            <ext:ResourceManager runat="server" />
            
            <ext:Panel runat="server" Title="Example" Height="215" Width="350">
                <TopBar>
                    <ext:Toolbar runat="server">
                        <Items>
                            <ext:SplitButton ID="Button1" runat="server" Text="Options" />
                        </Items>
                    </ext:Toolbar>
                </TopBar>
            </ext:Panel>
        </form>
    </body>
    </html>
    Last edited by fabricio.murta; Feb 22, 2015 at 9:06 PM. Reason: [CLOSED]
  2. #2
    Hello @tMp,

    By the approach you are attempting, I don't think this is quite feasible.

    But if you can opt out the syntax sugar to the constructors, I could suggest you (among other possibilities) the following solution.

    It was the more conservative approach I could come up with. While I keep the menu building process using the object initialization sugar, after menu is done, I dig thru it to add up the conditional entry.

    Look at the result of this attempt (replaces just your Page_Load() method):
        protected void Page_Load(object sender, EventArgs e)
        {
            var menu = new Menu
            {
                Items = { 
                    new MenuItem { Text = "Item 1" },
                    new MenuItem { 
                        Text = "Item 2",
                        Menu = {
                            new Menu {
                                Items = {
                                    new MenuItem { Text = "Item 2.1" },
                                    new MenuItem { Text = "Item 2.2" }
                                }
                            }
                        }
                    },
                    new MenuItem { Text = "Item 1" }
                }
            };
            if (!false) {
                // ensure you get correct expected XType for MenuItem
                var menuItemXType = new MenuItem().XType;
    
                // ensure you cycle only thru items that are actual menuItems
                var menuItemsOnly = menu.Items.FindAll(i => i.XType == menuItemXType);
                
                // get the menu item casting it as a MenuItem
                var secondMenu = menuItemsOnly.Find(i => ((MenuItem)i).Text == "Item 2") as MenuItem;
    
                // Add entries at will.
                secondMenu.Menu.First().Add(new MenuItem { Text = "Conditional Item 2.3" });
            }
    
            this.Button1.Menu.Add(menu);
        }
    Notice that in C#, a single-line
    var menuItm = new MenuItem { Text= "Something" };
    Is the same of
    var menuItm = new MenuItem();
    menuItm.Text="Something";
    With that in mind, you might be able to make the test during the menu creation if you write everything on the second form (without object initialization syntax sugar). Then you could just add the conditional while you are adding the items on the submenu of "Item 2".

    I hope this helps. Just let us know otherwise, right?

    EDIT: The XType tests are completely optional and illustrative! If you can guarantee your menu will only have objects of type MenuItem, you don't need to rely on the XType (or reflection) type ensuring before the cast.
    Last edited by fabricio.murta; Feb 21, 2015 at 8:32 PM.
    Fabrício Murta
    Developer & Support Expert
  3. #3
    Hi Fabricio

    Thank you for your quick and profound reply. I am going with the second form when I construct the menu at first. I knew that solution but was hoping for a "magic trick" to make the other idea work ;) It is just way easier to construct the menu that way. Please mark as resolved.

    best regards,

    tMp

    PS: The first form with the XType gave me another idea for a future step. So your answer helped me a lot!
  4. #4
    Nothing -- or almost nothing -- is impossible in the programming world. It's just a matter of how you think its alternatives. And how difficult that would be to implement. Sometimes when we make somewhere look nice, the other place looks uglier, and so the opposite.

    So, if you don't mind the additional overhead of carrying hidden menu entries, something close to your desired approach could be:
        protected void Page_Load(object sender, EventArgs e)
        {
            var nullMenuEntry = new MenuItem { Hidden = true };
            var menu = new Menu
            {
                Items = { 
                    new MenuItem { Text = "Item 1" },
                    new MenuItem { 
                        Text = "Item 2",
                        Menu = {
                            new Menu {
                                Items = {
                                    new MenuItem { Text = "Item 2.1" },
                                    new MenuItem { Text = "Item 2.2" },
                                    false ? new MenuItem { Text = "Item 2.2" } : nullMenuEntry // Try negating the test here
                                }
                            }
                        }
                    },
                    new MenuItem { Text = "Item 1" }
                }
            };
    
            this.Button1.Menu.Add(menu);
        }
    Note: I didn't test this with several nullMenuEntries -- it can possibly break if used more than once if for some reason the same instance of a menu entry is not allowed inside somewhere else on the menus hierarchy.
    Fabrício Murta
    Developer & Support Expert
  5. #5
    Now I am feeling really bad, how did I miss that solution?! Working like a charm! The menu isn't that huge so the cluttering is ok.

    Thank you very much. Definitely closed ;)
  6. #6

    Is there a way to define conditional rendering based on ternary operator on tpl?

    I would like to know how to use ternary operator on tpl within a dataview using razor engine


    .Store(X.Store()
                            ....
                        ).Tpl(@<text>
                                   <tpl for=".">
                                       <div class="holder">
                                           <div class="avatar"></div>
                                           <div class="h-content">
                                               <h2>{Name}</h2>
                                               <h3>{Phone} {Extension}</h3>
                                               <p>{Position} {CompanyName}</p>
                                           </div>
                                       </div>
                                   </tpl>
                        </text>)
                )


    I would like to add something like


    <div class="holder {[condition == true ? 'classA':'classB']}">
    ....
     </div>

    I've tried that way but as soon as the code is rendering that componet it just stops at the very first element.

    Any idea of how to use ternary conditions or an alternative that may look like that?
    (i dont want to copy/paste the same layout within an "else block" just to change a thing)
    Last edited by Daniil; Aug 31, 2015 at 8:46 AM. Reason: Please use [CODE] tags
  7. #7
    Hi @iskrazvezda,

    As far as I can see the original discussion it not related to templates. I think it is better if you start a new forum thread.

Similar Threads

  1. Replies: 6
    Last Post: Dec 06, 2013, 7:35 AM
  2. [CLOSED] MenuItem onDirectClick?
    By cwolcott in forum 2.x Legacy Premium Help
    Replies: 3
    Last Post: Oct 05, 2012, 12:01 PM
  3. Replies: 1
    Last Post: May 09, 2012, 7:08 PM
  4. create direct event in runtime to MenuItem
    By elbanna23 in forum 1.x Help
    Replies: 7
    Last Post: Jan 10, 2012, 1:12 PM
  5. How to get parent menuItem when click menuItem?
    By zhangsir199 in forum 1.x Help
    Replies: 2
    Last Post: Jan 21, 2011, 2:58 AM

Tags for this Thread

Posting Permissions