Loading ...
Sorry, an error occurred while loading the content.

16018Re: [ydn-javascript] Application Style Menu Bar issues

Expand Messages
  • Todd Kloots
    Aug 1 8:18 AM
      Steve -

      You are not setting the "disabled" configuration properly correctly -
      you need to use the "setProperty" method of the MenuItem instance's
      configuration object:

      myNewMenuItem.cfg.setProperty("disabled", false);

      For more information on configuration properties, read the section
      titled "Using Configuration Properties" on the Menu landing page:
      http://developer.yahoo.com/yui/menu/#configurationproperties

      Regarding your other problem - can you please provide more information
      on why you want to create and render a completely empty Menu and add
      items to it after rendering?

      - Todd

      Steve wrote:
      >
      > I am having a couple of problems with Menu. Any advice is
      > appreciated. I have an application style menubar which needs to
      > programmatically set the disable configuration. I have not had any
      > success using the menuItem.disabled functionality. I've attached some
      > sample code which demonstrates the problem.
      >
      > Additionally, I've found that adding menu items after the initial
      > rendering works unless there is not initial menu item. To duplicate,
      > comment out the line that says:
      > myMenu.addItem(junkMenuItem);
      >
      > When you do this, the menu will no longer display the new option
      > which was added using the addItem method.
      >
      > Thanks again for any help and/or advice.
      >
      > -Steve
      >
      > <html>
      > <head>
      > <title>Test Page</title>
      > <script type="text/javascript"
      > src="./yui/yahoo/yahoo.js"></script>
      > <script type="text/javascript"
      > src="./yui/event/event.js"></script>
      > <script type="text/javascript"
      > src="./yui/dom/dom.js"></script>
      > <script type="text/javascript"
      > src="./yui/animation/animation.js"></script>
      > <script type="text/javascript"
      > src="./yui/container/container.js"></script>
      > <script type="text/javascript"
      > src="./yui/menu/menu.js"></script>
      > <link rel="stylesheet" type="text/css"
      > href="./yui/fonts/fonts.css">
      > <link rel="stylesheet" type="text/css"
      > href="./yui/menu/assets/menu.css">
      > <script type="text/javascript">
      > YAHOO.util.Event.onDOMReady(onDOMReady);
      >
      > var myMenu = new YAHOO.widget.Menu("Actions");
      > var myOtherMenu = new YAHOO.widget.Menu
      > ("Tools");
      > var junkMenuItem = new YAHOO.widget.MenuItem
      > (" ");
      >
      > var mainMenuBar = new YAHOO.widget.MenuBar
      > ("myActionMenu", { lazyload: false});
      > var myNewMenuItem = new YAHOO.widget.MenuItem
      > ("Create Matrix", { disabled:true})
      >
      >
      > function onDOMReady() {
      > var myMenuBarItem = new
      > YAHOO.widget.MenuBarItem("TestMenu",{submenu: myMenu});
      > mainMenuBar.addItem(myMenuBarItem);
      > // Problem #1 - the menu won't
      > display when something is added
      > // later if there is not a menu item
      > during the render.
      > // If you remove the 'junkMenu', the
      > menu will not display
      > myMenu.addItem(junkMenuItem);
      >
      > var myOtherMenuBarItem = new
      > YAHOO.widget.MenuBarItem("Other Menu",{submenu: myOtherMenu});
      > myOtherMenu.addItem(new
      > YAHOO.widget.MenuItem("Sample"));
      >
      > mainMenuBar.addItem
      > (myOtherMenuBarItem);
      > mainMenuBar.render
      > (document.getElementById("applicationMenu"));
      > }
      >
      > function createNewMenuItem() {
      > myMenu.addItem(myNewMenuItem);
      > }
      >
      > function enable() {
      > myNewMenuItem.disable = false;
      > }
      >
      > function disable() {
      > myNewMenuItem.disable = true;
      > }
      > </script>
      >
      > </head>
      > <body onLoad="createNewMenuItem()">
      > <div id="applicationMenu"> </div>
      > <button type="button" onclick="enable
      > ()">Enable</button>
      > <button type="button" onclick="disable
      > ()">Disable</button>
      > </body>
      >
      > </html>
      >
      >
    • Show all 6 messages in this topic