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

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

Expand Messages
  • Todd Kloots
    Steve - You are not setting the disabled configuration properly correctly - you need to use the setProperty method of the MenuItem instance s configuration
    Message 1 of 6 , Aug 1, 2007
    • 0 Attachment
      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>
      >
      >
    • Steve
      Thanks, Todd. That is exactly what I was missing. In regards to the need for a blank menu, I though it would be easiest to give you an illustation. This link
      Message 2 of 6 , Aug 1, 2007
      • 0 Attachment
        Thanks, Todd. That is exactly what I was missing. In regards to the
        need for a blank menu, I though it would be easiest to give you an
        illustation. This link will give you the story of what I am trying to
        accomplish.

        http://talk.synaro.com/downloads/temp/ydn/todd.html

        Thanks again. I can't tell you and the group there at Yahoo! how much
        time I am saving by having all the great YUI tools available. I think
        they are awesome and just keep getting better.
      • allanbjork
        ... Has this been solved? I m trying to do something similar to what you illustrated at the above link, and have no luck at creating menus with dynamically
        Message 3 of 6 , Oct 8, 2007
        • 0 Attachment
          --- In ydn-javascript@yahoogroups.com, "Steve" <kelsey69@...> wrote:
          >
          > Thanks, Todd. That is exactly what I was missing. In regards to the
          > need for a blank menu, I though it would be easiest to give you an
          > illustation. This link will give you the story of what I am trying to
          > accomplish.
          >
          > http://talk.synaro.com/downloads/temp/ydn/todd.html
          >
          > Thanks again. I can't tell you and the group there at Yahoo! how much
          > time I am saving by having all the great YUI tools available. I think
          > they are awesome and just keep getting better.
          >


          Has this been solved? I'm trying to do something similar to what you
          illustrated at the above link, and have no luck at creating menus with
          dynamically changing items.
        • allanbjork
          Ok, I figured this out. If a call to getItems returned a zero length array, I would need to operate directly on the itemData array. (Is that because the menus
          Message 4 of 6 , Oct 9, 2007
          • 0 Attachment
            Ok, I figured this out.

            If a call to getItems returned a zero length array, I would need to
            operate directly on the itemData array. (Is that because the menus
            were marked lazyLoad:true?)

            By directly manipulating the itemData array, I could modify my menus
            after doing my database queries. (At least adding items, and toggling
            the disable flag work. Still writing the code to try removing items
            from the menus.)
          • allanbjork
            ... menus ... toggling ... items ... Removing items this way does work, but you have to always delete the element from itemData, even if getItems followed by a
            Message 5 of 6 , Oct 10, 2007
            • 0 Attachment
              --- In ydn-javascript@yahoogroups.com, "allanbjork" <abjork@...>
              wrote:
              >
              > Ok, I figured this out.
              >
              > If a call to getItems returned a zero length array, I would need to
              > operate directly on the itemData array. (Is that because the menus
              > were marked lazyLoad:true?)
              >
              > By directly manipulating the itemData array, I could modify my
              menus
              > after doing my database queries. (At least adding items, and
              toggling
              > the disable flag work. Still writing the code to try removing
              items
              > from the menus.)
              >


              Removing items this way does work, but you have to always delete
              the element from itemData, even if getItems followed by a call to
              removeItem works. Otherwise, once removeItem pulls the last menu
              entry off, the menu will get repopulated with the data present in
              itemData.

              YUI devs: could I suggest that a future version of the menu, be
              adjusted so that it when getItems/addItem/removeItem/etc. are called
              it simultaneously adjusts itemData as well? I think that would be
              more logical, and intuitive behaviour to YUI application developers.
              (And would also make my code a lot cleaner. ;-) )
            Your message has been successfully submitted and would be delivered to recipients shortly.