Where Are The Wise Men?

I have been working on a site that uses a lot of YUI components — specifically Grids and Menubar. They were both CSS based, even though the Menubar required a touch of JavaScript, like so:

var oMenuBar = new YAHOO.widget.MenuBar("menubar",
             {visible: true,
              position: "static",
              autosubmenudisplay:true
             }
           );
oMenuBar.render();
oMenuBar.show();

function onMenuMouseOver(p_sType, p_aArguments) {
    var oEvent = p_aArguments[0];
 }

The page had been rendering just fine in FireFox. When I loaded it up in IE6, however, the page rendered correctly, but then a popup appeared, saying that it couldn’t render the page. When you clicked “Okay” it went to IE’s standard “Page Not Found” display.

Weird, I know.

I looked at the code and didn’t see anything that I could see that caused it. I went to the YUI Message Board and appealed to the experts. Dav Glass that sometimes that happens when IE hasn’t rendered the object that you are trying to access. The work-around is to use the onAvailable or onContentReady methods. I looked at my code and quickly figured out that it must be the menubar div that isn’t rendered yet. So I changed it to this:

 function MenuObj(id) {
   YAHOO.util.Event.onAvailable(id,this.makeMenu,this);
 }

 MenuObj.prototype.makeMenu = function(that) {

   var oMenuBar = new YAHOO.widget.MenuBar("menubar",
            {visible: true,
             position: "static",
             autosubmenudisplay:true
            }
     );
   oMenuBar.render();
   oMenuBar.show();
}

var menubar = new MenuObj("menubar");

function onMenuMouseOver(p_sType, p_aArguments) {
           var oEvent = p_aArguments[0];
}

And wouldn’t you know? That worked.

Big thanks to Dav for helping me out!

This entry was posted on Sunday, March 18th, 2007 at 10:21 am and is filed under javascript. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.