Page 11 of 14 FirstFirst ... 910111213 ... LastLast
Results 101 to 110 of 133

Thread: Using the Toolbar as a menu

  1. #101
    Ext User
    Join Date
    Sep 2007
    Posts
    4
    Vote Rating
    0
      0  

    Default

    It's official - I am an !, or as my code above would indicate an 'idot'.
    Code:
    ...
    orentation: 'vertical',
    ...
    I think I will keep to myself how many hours I poured over that code trying to figure out why it wasn't working right and totally missed that spelling error.

  2. #102
    Ext User
    Join Date
    Mar 2007
    Posts
    18
    Vote Rating
    0
      0  

    Default

    Hello,

    I've just started to use this and have some of the basics down, I guess. I'm wondering a couple of things, though:
    • How does one cause a sub-menu to fly out WITHOUT clicking on the main menu? That is, how can the sub-menu fly out from a hover?
    • How does one make it such that clicking on a main menu item will follow the link instead of simply opening/closing the sub-menu?
    • Will a "slocummed" version of this be available in 2.0?

    Thanks in advance to anyone who takes the time to answer these questions.

    Travis

  3. #103
    Sencha Premium Member
    Join Date
    Jul 2007
    Location
    Sydney, Australia
    Posts
    261
    Vote Rating
    198
      0  

    Default

    Quote Originally Posted by chidera View Post
    Will a "slocummed" version of this be available in 2.0?
    I too am wondering about compatibility with 2.0 - is there something in 2.0 that replaces this? The alternative would be to update the extension for 2.0, if in fact any changes are required.

    Has anyone tried this against ExtJS 2.0 yet?

    Cheers,

    Scott

  4. #104
    Sencha User fangzhouxing's Avatar
    Join Date
    Mar 2007
    Posts
    471
    Vote Rating
    2
      0  

    Default

    Has anyone tried this against ExtJS 2.0 yet?
    Yes, I have tried the menuBar in ExtJS 2.0 dev 5, and had no problem.

  5. #105
    Ext User
    Join Date
    Oct 2007
    Location
    Central England
    Posts
    169
    Vote Rating
    0
      0  

    Default Menubar Issues

    Hi folks,

    First off, thanks Animal and contributors for the Menubar extension! I would recommend to the ExtJS core team that they take it as a starting point for putting a Menubar in ExtJS officially rather than as an extension. Even with modern interfaces, menubars are still sometimes necessary.

    I'm running into a couple of problems with the extension. Initially I wasn't sure if it was a 2.0-alpha-1 problem so I downloaded and tried it with 1.1 (I've never used ExtJS 1.x) but got the same results. There are two main problems I'm seeing:

    1. There is a marked delay between clicking the main menu item (for instance, "Static Data" in the demo) and the associated memo appearing. I thought this might be a "fade-in" or something but I wasn't seeing an effect. It's enough of a delay that it's irritating, and it's not a one-time thing, it happens every time on every menu. It's the showDelay config parameter in Ext.menu.Item, which defaults to 200ms. Recommendation: Automatically default showDelay to 0 for this kind of menu if not specified, users don't like to wait.

    2. Menus have a habit of closing when I haven't (intentionally) asked them to. I've seen this in various ways, but here's an easily-reproduced way that I've isolated: Using the demo, click the Static Data menu, move the mouse down to "Submenus" and click it to expand that submenu. The items will appear briefly (usually just long enough for me to get my mouse over there) and then the entire menu disappears. I'm guessing this is because of the click on the word "Submenus". But I've also seen them disappear without requiring a second click and I don't think my cursor moved out of the menu area. Naturally I could be wrong there, but other menus aren't disappearing on my all the time, so...

    I'm using Windows XP and tested with FF 2, Safari 3 beta, and Opera 9; same behavior in each (there's a highlighting problem on Opera 9 as well).

    Separately from the problems above, there are some behaviors I would recommend changing:

    A. You shouldn't have to click the main menu item to open the pull-down; just doing a mouse-down should be enough. With pull-down menus, the typical action (IMHO) is to mouse down on the top-level menu and keep it down while moving to your choice, and then release it. (The other action, clicking, should also work.) Changing line 56 of the current Menubar.js to hook the mousedown event instead of the click event works for getting the menu open and the highlighting of items works great, but more work is required -- releasing the mouse on the item doesn't trigger it.

    B. Keyboard navigation, part 1: The top-level menu seems to support keyboard navigation, but not with the keys I would expect: The up and down keys move me left and right (respectively) around the menus. I'd expect left and right to do that, with up and down opening the menu you're on at either the bottom or top item (respectively).

    C. Keyboard navigation, part 2: Using the left and right arrow keys when you're in a pulled-down menu that doesn't have a submenu should move you to the top-level menu to the left and right; currently they don't do anything.

    And finally a question: Is there an option to get rid of the down-arrow on the main menu item? Menu bars don't typcially have these... I haven't used ExtJS's menus extensively yet, but I didn't immediately see a BaseItem or Item config option for that.

    Thanks -- and again, thanks for the extension,
    T.J. Crowder
    tj / crowdersoftware / com

  6. #106
    Ext User tavox's Avatar
    Join Date
    Jun 2007
    Location
    Lima, Peru
    Posts
    23
    Vote Rating
    0
      0  

    Default

    Quote Originally Posted by venturi View Post
    Greetings!

    Love the MenuBar extension; it is exactly what I was looking for.

    Hoping someone here can help me identify the source and fix a small problem with it. This is mostly cosmetic, but quite annoying nonetheless. I'm pretty new to ext, and no JS guru either though I have been programming for a couple decades. So if my issue is worthy of labelling me "noob" so be it, I can take it.

    I'm building the menu dynamically from data pulled from an external db, and that is working fine. However, the items off the main menu list are not expanding out to the right. Instead they drop down below the opening menu item. I took the example code with the static menu and pasted it into the same script and those behave properly - items and sub-menus push out to the right and then flow down.

    The only difference I have been able to identify between my menu and the example one is that mine is built in pieces (each top level menu is a separate call to the add() method).

    Here is the code of my menu...
    Code:
      function popMenus () {
    
        var parent, child, myMenuItem, itemId;
    
        myMenu = new Ext.ux.Menubar({
          orentation: 'vertical'
        });
        for ( var i = 0; i < menuDS.getCount(); i++ ) {
          parent = menuDS.getAt(i).data;
          if ( parent.children.length ) {
            myChildren = [];
            for ( var j = 0; j < parent.children.length; j++ ) {
              child = parent.children[j];
              guid = child.program ? child.program : '';
              myChildren.push({ guid: guid, handler: loadScript, text: child.text });
            }
            guid = parent.program ? parent.program : '';
            myMenu.add( new Ext.menu.Item({
              hideOnClick: false,
              text: parent.text,
              menu: new Ext.menu.Menu({
                guid: guid,
                items: myChildren
            })}));
          } else {
            guid = parent.program ? parent.program : '';
            myMenu.add( new Ext.menu.Item({
              guid: parent.program,
              text: parent.text,
              handler: loadScript
            }));
          }
        }
        myMenu.show(Ext.get("west-div"), "bl-bl");
    
      } // popMenus
    Thanks in advance for your guidance!
    How do you load your records from the database into menuDS??? can you please explain it and also can you post your table structure?

    Best regards,

  7. #107
    Sencha User Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Nottingham
    Posts
    30,879
    Vote Rating
    84
      0  

    Default

    I think in Ext 2.0, you really can use the Toolbar as a Menu bar and save a lot of code.

    Try something like this:

    Code:
        var myMenubar; // must predeclare it so that listeners can reference it.
        myMenuBar = new Ext.Toolbar({
            buttons: [{
                text: 'File',
                menu: myFileMenu,
                listeners: {
                    mouseover: Ext.Toolbar.prototype.onButtonTriggerOver,
                    scope: myMenuBar // references the toolbar instance
                }
            }, [
                text: 'Edit',
                menu: myEditMenu,
                listeners: {
                    mouseover: Ext.Toolbar.prototype.onButtonTriggerOver,
                    scope: myMenuBar
                }
            }]
        });

  8. #108
    Sencha User Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Nottingham
    Posts
    30,879
    Vote Rating
    84
      0  

    Default

    Yeah that works.

    Try changing the following lines in examples/menu/menus.js. My additions are in bold:

    Code:
        tb.add({
                text:'Button w/ Menu',
                iconCls: 'bmenu',  // <-- icon
                menu: menu , // assign menu by instance
                listeners: {
    	            mouseover: Ext.Toolbar.prototype.onButtonTriggerOver,
    	            scope: tb
                }
            }, 
            new Ext.Toolbar.MenuButton({
                text: 'Split Button',
                handler: onButtonClick,
                tooltip: {text:'This is a QuickTip with autoHide set to false and a title', title:'Tip Title', autoHide:false},
                iconCls: 'blist',
                listeners: {
    	            mouseover: Ext.Toolbar.prototype.onButtonTriggerOver,
    	            scope: tb
                },

  9. #109
    Ext User
    Join Date
    Oct 2007
    Location
    Central England
    Posts
    169
    Vote Rating
    0
      0  

    Default

    Quote Originally Posted by Animal View Post
    Yeah that works.
    I'm not seeing much difference vs. the unchanged file; what's the behavior difference?

    Thanks,
    T.J. Crowder
    tj / crowdersoftware / com

  10. #110
    Sencha User Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Nottingham
    Posts
    30,879
    Vote Rating
    84
      0  

    Default

    Once you click on a button, and its menu is popped up mousing off that button and over another button on the toolbar that has a menu closes the old menu pops up the new button's menu. Just like a menu bar.

Page 11 of 14 FirstFirst ... 910111213 ... LastLast

Similar Threads

  1. toolbar menu on basic dialog or LayoutDialog
    By reang in forum Ext 1.x: Help & Discussion
    Replies: 2
    Last Post: 21 Mar 2007, 11:27 PM
  2. Toolbar split button/menu arrow not behaving
    By fecund in forum Ext 1.x: Help & Discussion
    Replies: 3
    Last Post: 8 Mar 2007, 10:55 PM
  3. Menu/Toolbar basic concepts
    By fecund in forum Ext 1.x: Help & Discussion
    Replies: 1
    Last Post: 6 Mar 2007, 12:21 PM
  4. Alpha 1.0 - Menu with image (not toolbar)
    By thameema in forum Ext 2.x: Help & Discussion
    Replies: 4
    Last Post: 23 Feb 2007, 4:27 AM
  5. IE6 FF difference in toolbar menu
    By vtswingkid in forum Ext 2.x: Help & Discussion
    Replies: 0
    Last Post: 22 Feb 2007, 8:44 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •